<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8"/>
  <title>iconfont Demo</title>
  <link rel="shortcut icon" href="//img.alicdn.com/imgextra/i2/O1CN01ZyAlrn1MwaMhqz36G_!!6000000001499-73-tps-64-64.ico" type="image/x-icon"/>
  <link rel="icon" type="image/svg+xml" href="//img.alicdn.com/imgextra/i4/O1CN01EYTRnJ297D6vehehJ_!!6000000008020-55-tps-64-64.svg"/>
  <link rel="stylesheet" href="https://g.alicdn.com/thx/cube/1.3.2/cube.min.css">
  <link rel="stylesheet" href="demo.css">
  <link rel="stylesheet" href="iconfont.css">
  <script src="iconfont.js"></script>
  <!-- jQuery -->
  <script src="https://a1.alicdn.com/oss/uploads/2018/12/26/7bfddb60-08e8-11e9-9b04-53e73bb6408b.js"></script>
  <!-- 代码高亮 -->
  <script src="https://a1.alicdn.com/oss/uploads/2018/12/26/a3f714d0-08e6-11e9-8a15-ebf944d7534c.js"></script>
  <style>
    .main .logo {
      margin-top: 0;
      height: auto;
    }

    .main .logo a {
      display: flex;
      align-items: center;
    }

    .main .logo .sub-title {
      margin-left: 0.5em;
      font-size: 22px;
      color: #fff;
      background: linear-gradient(-45deg, #3967FF, #B500FE);
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
    }
  </style>
</head>
<body>
  <div class="main">
    <h1 class="logo"><a href="https://www.iconfont.cn/" title="iconfont 首页" target="_blank">
      <img width="200" src="https://img.alicdn.com/imgextra/i3/O1CN01Mn65HV1FfSEzR6DKv_!!6000000000514-55-tps-228-59.svg">
      
    </a></h1>
    <div class="nav-tabs">
      <ul id="tabs" class="dib-box">
        <li class="dib active"><span>Unicode</span></li>
        <li class="dib"><span>Font class</span></li>
        <li class="dib"><span>Symbol</span></li>
      </ul>
      
      <a href="https://www.iconfont.cn/manage/index?manage_type=myprojects&projectId=2338558" target="_blank" class="nav-more">查看项目</a>
      
    </div>
    <div class="tab-container">
      <div class="content unicode" style="display: block;">
          <ul class="icon_lists dib-box">
          
            <li class="dib">
              <span class="icon iconfont">&#xe6dc;</span>
                <div class="name">面性图标-批量作业流导入</div>
                <div class="code-name">&amp;#xe6dc;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe74b;</span>
                <div class="name">面性图标-批量作业导入</div>
                <div class="code-name">&amp;#xe74b;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe74c;</span>
                <div class="name">面性图标-新建单个作业</div>
                <div class="code-name">&amp;#xe74c;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe74d;</span>
                <div class="name">面性图标-新建单个作业流</div>
                <div class="code-name">&amp;#xe74d;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe62a;</span>
                <div class="name">面性图标-云平台监控</div>
                <div class="code-name">&amp;#xe62a;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe629;</span>
                <div class="name">线性图标-锁定</div>
                <div class="code-name">&amp;#xe629;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe726;</span>
                <div class="name">面性图标-待处理工单</div>
                <div class="code-name">&amp;#xe726;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe749;</span>
                <div class="name">面性图标-应用管理</div>
                <div class="code-name">&amp;#xe749;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6ed;</span>
                <div class="name">面性图标- 服务月注册数</div>
                <div class="code-name">&amp;#xe6ed;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe721;</span>
                <div class="name">面性图标- 执行历史</div>
                <div class="code-name">&amp;#xe721;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe727;</span>
                <div class="name">面性图标-程序包</div>
                <div class="code-name">&amp;#xe727;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe72f;</span>
                <div class="name">面性图标- 回滚任务模板</div>
                <div class="code-name">&amp;#xe72f;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe73c;</span>
                <div class="name">面性图标- 软件包管理</div>
                <div class="code-name">&amp;#xe73c;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe73d;</span>
                <div class="name">面性图标-工单映射</div>
                <div class="code-name">&amp;#xe73d;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe73e;</span>
                <div class="name">面性图标-快速发布模板</div>
                <div class="code-name">&amp;#xe73e;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe73f;</span>
                <div class="name">面性图标-分拣任务</div>
                <div class="code-name">&amp;#xe73f;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe740;</span>
                <div class="name">面性图标-模板集</div>
                <div class="code-name">&amp;#xe740;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe741;</span>
                <div class="name">面性图标-快速发布</div>
                <div class="code-name">&amp;#xe741;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe742;</span>
                <div class="name">面性图标-程序包数</div>
                <div class="code-name">&amp;#xe742;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe743;</span>
                <div class="name">面性图标-快速回滚</div>
                <div class="code-name">&amp;#xe743;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe744;</span>
                <div class="name">面性图标-配置文件</div>
                <div class="code-name">&amp;#xe744;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe745;</span>
                <div class="name">面性图标-配置文件数</div>
                <div class="code-name">&amp;#xe745;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe746;</span>
                <div class="name">面性图标-应用数量</div>
                <div class="code-name">&amp;#xe746;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe747;</span>
                <div class="name">面性图标-任务管理</div>
                <div class="code-name">&amp;#xe747;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe748;</span>
                <div class="name">面性图标-已发布服务数</div>
                <div class="code-name">&amp;#xe748;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe74a;</span>
                <div class="name">面性图标-SQL包</div>
                <div class="code-name">&amp;#xe74a;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe628;</span>
                <div class="name">面性图标-警告提醒</div>
                <div class="code-name">&amp;#xe628;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe627;</span>
                <div class="name">面性图标-图表2</div>
                <div class="code-name">&amp;#xe627;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe626;</span>
                <div class="name">面性图标-图表1</div>
                <div class="code-name">&amp;#xe626;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe625;</span>
                <div class="name">面性图标-时间表</div>
                <div class="code-name">&amp;#xe625;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe624;</span>
                <div class="name">面性图标-置顶</div>
                <div class="code-name">&amp;#xe624;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe623;</span>
                <div class="name">面性图标-置底</div>
                <div class="code-name">&amp;#xe623;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe620;</span>
                <div class="name">功能性图标-window</div>
                <div class="code-name">&amp;#xe620;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe61f;</span>
                <div class="name">功能性图标-tomcat</div>
                <div class="code-name">&amp;#xe61f;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe61e;</span>
                <div class="name">功能性图标-mysql</div>
                <div class="code-name">&amp;#xe61e;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe61d;</span>
                <div class="name">功能性图标-linux</div>
                <div class="code-name">&amp;#xe61d;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe61a;</span>
                <div class="name">面性图标-卡片图标背景</div>
                <div class="code-name">&amp;#xe61a;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe619;</span>
                <div class="name">面性图标-致命</div>
                <div class="code-name">&amp;#xe619;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe71c;</span>
                <div class="name">子网</div>
                <div class="code-name">&amp;#xe71c;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe705;</span>
                <div class="name">面性图标- 磁盘容量</div>
                <div class="code-name">&amp;#xe705;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe706;</span>
                <div class="name">面性图标-服务中心</div>
                <div class="code-name">&amp;#xe706;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe709;</span>
                <div class="name">面性图标-月使用服务数</div>
                <div class="code-name">&amp;#xe709;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe739;</span>
                <div class="name">面性图标-服务管理</div>
                <div class="code-name">&amp;#xe739;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe73a;</span>
                <div class="name">面性图标-SLA管理</div>
                <div class="code-name">&amp;#xe73a;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe73b;</span>
                <div class="name">面性图标-平台管理</div>
                <div class="code-name">&amp;#xe73b;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe735;</span>
                <div class="name">面性图标-存储管理</div>
                <div class="code-name">&amp;#xe735;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe736;</span>
                <div class="name">面性图标-网络管理</div>
                <div class="code-name">&amp;#xe736;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe737;</span>
                <div class="name">面性图标-主机管理</div>
                <div class="code-name">&amp;#xe737;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe738;</span>
                <div class="name">面性图标-操作日志</div>
                <div class="code-name">&amp;#xe738;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe728;</span>
                <div class="name">面性图标-服务目录</div>
                <div class="code-name">&amp;#xe728;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe729;</span>
                <div class="name">面性图标-部门管理</div>
                <div class="code-name">&amp;#xe729;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe72a;</span>
                <div class="name">面性图标-成本分析</div>
                <div class="code-name">&amp;#xe72a;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe72b;</span>
                <div class="name">面性图标-资源分析</div>
                <div class="code-name">&amp;#xe72b;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe72c;</span>
                <div class="name">面性图标-系统设置</div>
                <div class="code-name">&amp;#xe72c;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe72d;</span>
                <div class="name">面性图标-业务主机管理</div>
                <div class="code-name">&amp;#xe72d;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe72e;</span>
                <div class="name">面性图标-资源中心</div>
                <div class="code-name">&amp;#xe72e;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe730;</span>
                <div class="name">面性图标-运营中心</div>
                <div class="code-name">&amp;#xe730;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe731;</span>
                <div class="name">面性图标-云管理</div>
                <div class="code-name">&amp;#xe731;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe732;</span>
                <div class="name">面性图标-服务总览</div>
                <div class="code-name">&amp;#xe732;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe733;</span>
                <div class="name">面性图标-租户管理</div>
                <div class="code-name">&amp;#xe733;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe734;</span>
                <div class="name">面性图标-组织管理</div>
                <div class="code-name">&amp;#xe734;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe714;</span>
                <div class="name">面性图标-工单数</div>
                <div class="code-name">&amp;#xe714;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe722;</span>
                <div class="name">面性图标-存储</div>
                <div class="code-name">&amp;#xe722;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe723;</span>
                <div class="name">面性图标-方块</div>
                <div class="code-name">&amp;#xe723;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe724;</span>
                <div class="name">面性图标-存储桶</div>
                <div class="code-name">&amp;#xe724;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe725;</span>
                <div class="name">面性图标-安全组</div>
                <div class="code-name">&amp;#xe725;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe715;</span>
                <div class="name">面性图标-工单管理</div>
                <div class="code-name">&amp;#xe715;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe716;</span>
                <div class="name">面性图标-服务总数</div>
                <div class="code-name">&amp;#xe716;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe717;</span>
                <div class="name">面性图标-内存</div>
                <div class="code-name">&amp;#xe717;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe718;</span>
                <div class="name">面性图标-镜像</div>
                <div class="code-name">&amp;#xe718;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe719;</span>
                <div class="name">面性图标-角色管理</div>
                <div class="code-name">&amp;#xe719;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe71a;</span>
                <div class="name">面性图标-数据库</div>
                <div class="code-name">&amp;#xe71a;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe71b;</span>
                <div class="name">面性图标-硬盘</div>
                <div class="code-name">&amp;#xe71b;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe71d;</span>
                <div class="name">面性图标-主机</div>
                <div class="code-name">&amp;#xe71d;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe71e;</span>
                <div class="name">面性图标-快照</div>
                <div class="code-name">&amp;#xe71e;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe71f;</span>
                <div class="name">面性图标-列表</div>
                <div class="code-name">&amp;#xe71f;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe720;</span>
                <div class="name">面性图标-执行记录</div>
                <div class="code-name">&amp;#xe720;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe70a;</span>
                <div class="name">面性图标- 内存总量</div>
                <div class="code-name">&amp;#xe70a;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe70b;</span>
                <div class="name">面性图标-计算机资源当月消费</div>
                <div class="code-name">&amp;#xe70b;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe70c;</span>
                <div class="name">面性图标-磁盘当月消费</div>
                <div class="code-name">&amp;#xe70c;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe70d;</span>
                <div class="name">面性图标-租户资源池</div>
                <div class="code-name">&amp;#xe70d;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe70e;</span>
                <div class="name">面性图标-高峰期设置</div>
                <div class="code-name">&amp;#xe70e;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe70f;</span>
                <div class="name">面性图标-项目管理</div>
                <div class="code-name">&amp;#xe70f;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe710;</span>
                <div class="name">面性图标-容量分析</div>
                <div class="code-name">&amp;#xe710;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe711;</span>
                <div class="name">面性图标-虚拟机当月总消费</div>
                <div class="code-name">&amp;#xe711;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe712;</span>
                <div class="name">面性图标-CPU核数</div>
                <div class="code-name">&amp;#xe712;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe713;</span>
                <div class="name">面性图标-VPC</div>
                <div class="code-name">&amp;#xe713;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe704;</span>
                <div class="name">面性图标-服务运营</div>
                <div class="code-name">&amp;#xe704;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe707;</span>
                <div class="name">面性图标-流程管理</div>
                <div class="code-name">&amp;#xe707;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe708;</span>
                <div class="name">面性图标-权限管理</div>
                <div class="code-name">&amp;#xe708;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe703;</span>
                <div class="name">面性图标-应用概览</div>
                <div class="code-name">&amp;#xe703;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe700;</span>
                <div class="name">线性图标-开始</div>
                <div class="code-name">&amp;#xe700;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe701;</span>
                <div class="name">线性图标-暂停</div>
                <div class="code-name">&amp;#xe701;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe702;</span>
                <div class="name">线性图标-停止</div>
                <div class="code-name">&amp;#xe702;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6fe;</span>
                <div class="name">线性图标-跳过</div>
                <div class="code-name">&amp;#xe6fe;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6ff;</span>
                <div class="name">线性图标-上传</div>
                <div class="code-name">&amp;#xe6ff;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6f6;</span>
                <div class="name">线性图标-文件夹</div>
                <div class="code-name">&amp;#xe6f6;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6ee;</span>
                <div class="name">线性图标-导出</div>
                <div class="code-name">&amp;#xe6ee;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6ef;</span>
                <div class="name">线性图标-分享</div>
                <div class="code-name">&amp;#xe6ef;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6f0;</span>
                <div class="name">线性图标-时间类型</div>
                <div class="code-name">&amp;#xe6f0;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6f1;</span>
                <div class="name">线性图标-编辑仪表板</div>
                <div class="code-name">&amp;#xe6f1;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6f2;</span>
                <div class="name">线性图标-打开文件夹</div>
                <div class="code-name">&amp;#xe6f2;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6f3;</span>
                <div class="name">线性图标-关联设置</div>
                <div class="code-name">&amp;#xe6f3;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6f4;</span>
                <div class="name">线性图标-数值类型</div>
                <div class="code-name">&amp;#xe6f4;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6f5;</span>
                <div class="name">线性图标-刷新</div>
                <div class="code-name">&amp;#xe6f5;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6f7;</span>
                <div class="name">线性图标-预览</div>
                <div class="code-name">&amp;#xe6f7;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6f8;</span>
                <div class="name">线性图标-生成报表</div>
                <div class="code-name">&amp;#xe6f8;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6f9;</span>
                <div class="name">线性图标-设置过滤条件</div>
                <div class="code-name">&amp;#xe6f9;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6fa;</span>
                <div class="name">线性图标-文本</div>
                <div class="code-name">&amp;#xe6fa;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6fb;</span>
                <div class="name">线性图标-新建字段</div>
                <div class="code-name">&amp;#xe6fb;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6fc;</span>
                <div class="name">线性图标-数据集</div>
                <div class="code-name">&amp;#xe6fc;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6fd;</span>
                <div class="name">线性图标-选择数据源</div>
                <div class="code-name">&amp;#xe6fd;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6eb;</span>
                <div class="name">面性图标-问题</div>
                <div class="code-name">&amp;#xe6eb;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6ec;</span>
                <div class="name">面性图标-应用配置中心</div>
                <div class="code-name">&amp;#xe6ec;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6e1;</span>
                <div class="name">面性图标-全局水印</div>
                <div class="code-name">&amp;#xe6e1;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6e2;</span>
                <div class="name">面性图标-我的应用</div>
                <div class="code-name">&amp;#xe6e2;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6e3;</span>
                <div class="name">面性图标-操作日志</div>
                <div class="code-name">&amp;#xe6e3;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6e4;</span>
                <div class="name">面性图标-用户管理</div>
                <div class="code-name">&amp;#xe6e4;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6e5;</span>
                <div class="name">面性图标-严重告警</div>
                <div class="code-name">&amp;#xe6e5;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6e6;</span>
                <div class="name">面性图标-应用日志管理</div>
                <div class="code-name">&amp;#xe6e6;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6e7;</span>
                <div class="name">面性图标-应用资源告警</div>
                <div class="code-name">&amp;#xe6e7;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6e8;</span>
                <div class="name">面性图标-应用巡检</div>
                <div class="code-name">&amp;#xe6e8;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6e9;</span>
                <div class="name">面性图标-应用启停</div>
                <div class="code-name">&amp;#xe6e9;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6ea;</span>
                <div class="name">面性图标-LOGO设置</div>
                <div class="code-name">&amp;#xe6ea;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6de;</span>
                <div class="name">线性图标-恢复</div>
                <div class="code-name">&amp;#xe6de;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6df;</span>
                <div class="name">线性图标-督办</div>
                <div class="code-name">&amp;#xe6df;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6e0;</span>
                <div class="name">线性图标-触发</div>
                <div class="code-name">&amp;#xe6e0;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6dd;</span>
                <div class="name">面性图标-人员信息</div>
                <div class="code-name">&amp;#xe6dd;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6da;</span>
                <div class="name">面性图标-收藏-选中</div>
                <div class="code-name">&amp;#xe6da;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6db;</span>
                <div class="name">线性图标-收藏</div>
                <div class="code-name">&amp;#xe6db;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6d4;</span>
                <div class="name">面性图标-当日作业流数</div>
                <div class="code-name">&amp;#xe6d4;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6d5;</span>
                <div class="name">面性图标-当日作业总数</div>
                <div class="code-name">&amp;#xe6d5;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6d6;</span>
                <div class="name">面性图标-系统</div>
                <div class="code-name">&amp;#xe6d6;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6d7;</span>
                <div class="name">面性图标-基本信息</div>
                <div class="code-name">&amp;#xe6d7;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6d8;</span>
                <div class="name">面性图标-任务编排</div>
                <div class="code-name">&amp;#xe6d8;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6d9;</span>
                <div class="name">面性图标-作业</div>
                <div class="code-name">&amp;#xe6d9;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6d3;</span>
                <div class="name">面性图标-时间</div>
                <div class="code-name">&amp;#xe6d3;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6c0;</span>
                <div class="name">面性图标-告警中心</div>
                <div class="code-name">&amp;#xe6c0;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6c1;</span>
                <div class="name">面性图标-近24小时问题对象</div>
                <div class="code-name">&amp;#xe6c1;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6c2;</span>
                <div class="name">面形图标-作业历史</div>
                <div class="code-name">&amp;#xe6c2;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6c3;</span>
                <div class="name">面性图标-集群</div>
                <div class="code-name">&amp;#xe6c3;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6c4;</span>
                <div class="name">面性图标-监控对象数量</div>
                <div class="code-name">&amp;#xe6c4;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6c5;</span>
                <div class="name">面性图标-首页</div>
                <div class="code-name">&amp;#xe6c5;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6c6;</span>
                <div class="name">面性图标-事件中心</div>
                <div class="code-name">&amp;#xe6c6;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6c7;</span>
                <div class="name">面性图标-业务</div>
                <div class="code-name">&amp;#xe6c7;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6c8;</span>
                <div class="name">面性图标-应用健康视图</div>
                <div class="code-name">&amp;#xe6c8;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6c9;</span>
                <div class="name">面性图标-应用墙</div>
                <div class="code-name">&amp;#xe6c9;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6ca;</span>
                <div class="name">面性图标-作业监控大屏</div>
                <div class="code-name">&amp;#xe6ca;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6cb;</span>
                <div class="name">面性图标-应用监控管理</div>
                <div class="code-name">&amp;#xe6cb;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6cc;</span>
                <div class="name">面性图标-作业流管理</div>
                <div class="code-name">&amp;#xe6cc;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6cd;</span>
                <div class="name">面性图标-作业管理</div>
                <div class="code-name">&amp;#xe6cd;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6ce;</span>
                <div class="name">面性图标-作业监控</div>
                <div class="code-name">&amp;#xe6ce;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6cf;</span>
                <div class="name">面性图标-子系统</div>
                <div class="code-name">&amp;#xe6cf;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6d0;</span>
                <div class="name">面性图标-Agent 管理</div>
                <div class="code-name">&amp;#xe6d0;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6d1;</span>
                <div class="name">面性图标-实时健康评分</div>
                <div class="code-name">&amp;#xe6d1;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6d2;</span>
                <div class="name">面性图标-模块</div>
                <div class="code-name">&amp;#xe6d2;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6b6;</span>
                <div class="name">常用图标-表格排序</div>
                <div class="code-name">&amp;#xe6b6;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6bc;</span>
                <div class="name">常用图标-加号</div>
                <div class="code-name">&amp;#xe6bc;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6bd;</span>
                <div class="name">常用图标-箭头</div>
                <div class="code-name">&amp;#xe6bd;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6be;</span>
                <div class="name">常用图标-返回</div>
                <div class="code-name">&amp;#xe6be;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6bf;</span>
                <div class="name">常用图标-双箭头</div>
                <div class="code-name">&amp;#xe6bf;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6b7;</span>
                <div class="name">常用图标-必填星号</div>
                <div class="code-name">&amp;#xe6b7;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6b8;</span>
                <div class="name">常用图标-对号</div>
                <div class="code-name">&amp;#xe6b8;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6b9;</span>
                <div class="name">常用图标-叉号</div>
                <div class="code-name">&amp;#xe6b9;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6ba;</span>
                <div class="name">常用图标-减号</div>
                <div class="code-name">&amp;#xe6ba;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6bb;</span>
                <div class="name">常用图标-编辑</div>
                <div class="code-name">&amp;#xe6bb;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6af;</span>
                <div class="name">面性图标-时间</div>
                <div class="code-name">&amp;#xe6af;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6b0;</span>
                <div class="name">面性图标-设置</div>
                <div class="code-name">&amp;#xe6b0;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6b1;</span>
                <div class="name">面性图标-搜索</div>
                <div class="code-name">&amp;#xe6b1;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6b2;</span>
                <div class="name">面性图标-用户</div>
                <div class="code-name">&amp;#xe6b2;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6b3;</span>
                <div class="name">面性图标-终止</div>
                <div class="code-name">&amp;#xe6b3;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6b4;</span>
                <div class="name">面性图标-通知</div>
                <div class="code-name">&amp;#xe6b4;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6b5;</span>
                <div class="name">面性图标-提示</div>
                <div class="code-name">&amp;#xe6b5;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6a3;</span>
                <div class="name">面性图标-对</div>
                <div class="code-name">&amp;#xe6a3;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6a4;</span>
                <div class="name">面性图标-加号（圆）</div>
                <div class="code-name">&amp;#xe6a4;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6a5;</span>
                <div class="name">面性图标-错</div>
                <div class="code-name">&amp;#xe6a5;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6a6;</span>
                <div class="name">面性图标-驳回</div>
                <div class="code-name">&amp;#xe6a6;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6a7;</span>
                <div class="name">面性图标-帮助</div>
                <div class="code-name">&amp;#xe6a7;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6a8;</span>
                <div class="name">面性图标-加</div>
                <div class="code-name">&amp;#xe6a8;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6a9;</span>
                <div class="name">面性图标-日期</div>
                <div class="code-name">&amp;#xe6a9;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6aa;</span>
                <div class="name">面性图标-减</div>
                <div class="code-name">&amp;#xe6aa;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6ab;</span>
                <div class="name">面性图标-筛选</div>
                <div class="code-name">&amp;#xe6ab;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6ac;</span>
                <div class="name">面性图标-减号（圆）</div>
                <div class="code-name">&amp;#xe6ac;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6ad;</span>
                <div class="name">面性图标-加载</div>
                <div class="code-name">&amp;#xe6ad;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6ae;</span>
                <div class="name">面性图标-全屏</div>
                <div class="code-name">&amp;#xe6ae;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe69c;</span>
                <div class="name">线性图标-撤单</div>
                <div class="code-name">&amp;#xe69c;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe69d;</span>
                <div class="name">线性图标-打印</div>
                <div class="code-name">&amp;#xe69d;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe69e;</span>
                <div class="name">线性图标-加号（圆）</div>
                <div class="code-name">&amp;#xe69e;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe69f;</span>
                <div class="name">线性图标-附件</div>
                <div class="code-name">&amp;#xe69f;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6a0;</span>
                <div class="name">线性图标-挂起</div>
                <div class="code-name">&amp;#xe6a0;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6a1;</span>
                <div class="name">线性图标-下载</div>
                <div class="code-name">&amp;#xe6a1;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6a2;</span>
                <div class="name">线性图标-减号（圆）</div>
                <div class="code-name">&amp;#xe6a2;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe695;</span>
                <div class="name">线性图标-保存</div>
                <div class="code-name">&amp;#xe695;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe696;</span>
                <div class="name">线性图标-不可见</div>
                <div class="code-name">&amp;#xe696;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe697;</span>
                <div class="name">线性图标-全屏</div>
                <div class="code-name">&amp;#xe697;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe698;</span>
                <div class="name">线性图标-回复</div>
                <div class="code-name">&amp;#xe698;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe699;</span>
                <div class="name">线性图标-还原</div>
                <div class="code-name">&amp;#xe699;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe69a;</span>
                <div class="name">线性图标-可见</div>
                <div class="code-name">&amp;#xe69a;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe69b;</span>
                <div class="name">线性图标-一键编排</div>
                <div class="code-name">&amp;#xe69b;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe68d;</span>
                <div class="name">线性图标-复位</div>
                <div class="code-name">&amp;#xe68d;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe68e;</span>
                <div class="name">线性图标-减</div>
                <div class="code-name">&amp;#xe68e;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe68f;</span>
                <div class="name">线性图标-加</div>
                <div class="code-name">&amp;#xe68f;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe690;</span>
                <div class="name">线性图标-驳回</div>
                <div class="code-name">&amp;#xe690;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe692;</span>
                <div class="name">线性图标-提示</div>
                <div class="code-name">&amp;#xe692;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe693;</span>
                <div class="name">线性图标-终止</div>
                <div class="code-name">&amp;#xe693;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe694;</span>
                <div class="name">线性图标-点赞</div>
                <div class="code-name">&amp;#xe694;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe687;</span>
                <div class="name">线性图标-组件架构</div>
                <div class="code-name">&amp;#xe687;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe686;</span>
                <div class="name">线性图标-日期</div>
                <div class="code-name">&amp;#xe686;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe688;</span>
                <div class="name">线性图标-时间</div>
                <div class="code-name">&amp;#xe688;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe689;</span>
                <div class="name">线性图标-对</div>
                <div class="code-name">&amp;#xe689;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe68a;</span>
                <div class="name">线性图标-错</div>
                <div class="code-name">&amp;#xe68a;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe68b;</span>
                <div class="name">线性图标-文件</div>
                <div class="code-name">&amp;#xe68b;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe68c;</span>
                <div class="name">线性图标-搜索</div>
                <div class="code-name">&amp;#xe68c;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe685;</span>
                <div class="name">线性图标-历史记录</div>
                <div class="code-name">&amp;#xe685;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe684;</span>
                <div class="name">线性图标-帮助</div>
                <div class="code-name">&amp;#xe684;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe683;</span>
                <div class="name">线性图标-复制</div>
                <div class="code-name">&amp;#xe683;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe67e;</span>
                <div class="name">线性图标-关闭工单</div>
                <div class="code-name">&amp;#xe67e;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe67f;</span>
                <div class="name">线性图标-提示</div>
                <div class="code-name">&amp;#xe67f;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe680;</span>
                <div class="name">线性图标-通知</div>
                <div class="code-name">&amp;#xe680;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe681;</span>
                <div class="name">线性图标-设置</div>
                <div class="code-name">&amp;#xe681;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe682;</span>
                <div class="name">线性图标-用户</div>
                <div class="code-name">&amp;#xe682;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe67c;</span>
                <div class="name">线性图标-拉伸</div>
                <div class="code-name">&amp;#xe67c;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe67d;</span>
                <div class="name">线性图标-删除</div>
                <div class="code-name">&amp;#xe67d;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe67a;</span>
                <div class="name">线性图标-展开</div>
                <div class="code-name">&amp;#xe67a;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe67b;</span>
                <div class="name">线性图标-收起</div>
                <div class="code-name">&amp;#xe67b;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe677;</span>
                <div class="name">线性图标-跳转</div>
                <div class="code-name">&amp;#xe677;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe678;</span>
                <div class="name">线性图标-拖动</div>
                <div class="code-name">&amp;#xe678;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe679;</span>
                <div class="name">线性图标-时间</div>
                <div class="code-name">&amp;#xe679;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe670;</span>
                <div class="name">线性图标-全屏</div>
                <div class="code-name">&amp;#xe670;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe671;</span>
                <div class="name">线性图标-更多</div>
                <div class="code-name">&amp;#xe671;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe672;</span>
                <div class="name">线性图标-可拖动</div>
                <div class="code-name">&amp;#xe672;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe673;</span>
                <div class="name">线性图标-瞄准</div>
                <div class="code-name">&amp;#xe673;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe674;</span>
                <div class="name">线性图标-排序</div>
                <div class="code-name">&amp;#xe674;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe675;</span>
                <div class="name">线性图标-批量编辑</div>
                <div class="code-name">&amp;#xe675;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe676;</span>
                <div class="name">线性图标-设置2</div>
                <div class="code-name">&amp;#xe676;</div>
              </li>
          
          </ul>
          <div class="article markdown">
          <h2 id="unicode-">Unicode 引用</h2>
          <hr>

          <p>Unicode 是字体在网页端最原始的应用方式，特点是：</p>
          <ul>
            <li>支持按字体的方式去动态调整图标大小，颜色等等。</li>
            <li>默认情况下不支持多色，直接添加多色图标会自动去色。</li>
          </ul>
          <blockquote>
            <p>注意：新版 iconfont 支持两种方式引用多色图标：SVG symbol 引用方式和彩色字体图标模式。（使用彩色字体图标需要在「编辑项目」中开启「彩色」选项后并重新生成。）</p>
          </blockquote>
          <p>Unicode 使用步骤如下：</p>
          <h3 id="-font-face">第一步：拷贝项目下面生成的 <code>@font-face</code></h3>
<pre><code class="language-css"
>@font-face {
  font-family: 'iconfont';
  src: url('iconfont.woff2?t=1622427656520') format('woff2'),
       url('iconfont.woff?t=1622427656520') format('woff'),
       url('iconfont.ttf?t=1622427656520') format('truetype');
}
</code></pre>
          <h3 id="-iconfont-">第二步：定义使用 iconfont 的样式</h3>
<pre><code class="language-css"
>.iconfont {
  font-family: "iconfont" !important;
  font-size: 16px;
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
</code></pre>
          <h3 id="-">第三步：挑选相应图标并获取字体编码，应用于页面</h3>
<pre>
<code class="language-html"
>&lt;span class="iconfont"&gt;&amp;#x33;&lt;/span&gt;
</code></pre>
          <blockquote>
            <p>"iconfont" 是你项目下的 font-family。可以通过编辑项目查看，默认是 "iconfont"。</p>
          </blockquote>
          </div>
      </div>
      <div class="content font-class">
        <ul class="icon_lists dib-box">
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-piliangzuoyeliudaoru"></span>
            <div class="name">
              面性图标-批量作业流导入
            </div>
            <div class="code-name">.icon-mianxingtubiao-piliangzuoyeliudaoru
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-piliangzuoyedaoru"></span>
            <div class="name">
              面性图标-批量作业导入
            </div>
            <div class="code-name">.icon-mianxingtubiao-piliangzuoyedaoru
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-xinjiandangezuoye"></span>
            <div class="name">
              面性图标-新建单个作业
            </div>
            <div class="code-name">.icon-mianxingtubiao-xinjiandangezuoye
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-xinjiandangezuoyeliu"></span>
            <div class="name">
              面性图标-新建单个作业流
            </div>
            <div class="code-name">.icon-mianxingtubiao-xinjiandangezuoyeliu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-yunpingtaijiankong"></span>
            <div class="name">
              面性图标-云平台监控
            </div>
            <div class="code-name">.icon-yunpingtaijiankong
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-xianxingtubiao-suoding"></span>
            <div class="name">
              线性图标-锁定
            </div>
            <div class="code-name">.icon-xianxingtubiao-suoding
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-daichuligongdan"></span>
            <div class="name">
              面性图标-待处理工单
            </div>
            <div class="code-name">.icon-mianxingtubiao-daichuligongdan
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-yingyongguanli"></span>
            <div class="name">
              面性图标-应用管理
            </div>
            <div class="code-name">.icon-mianxingtubiao-yingyongguanli
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-fuwuyuezhuceshu"></span>
            <div class="name">
              面性图标- 服务月注册数
            </div>
            <div class="code-name">.icon-mianxingtubiao-fuwuyuezhuceshu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-zhihanglishi"></span>
            <div class="name">
              面性图标- 执行历史
            </div>
            <div class="code-name">.icon-mianxingtubiao-zhihanglishi
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-chengxubao"></span>
            <div class="name">
              面性图标-程序包
            </div>
            <div class="code-name">.icon-mianxingtubiao-chengxubao
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-huigunrenwumoban"></span>
            <div class="name">
              面性图标- 回滚任务模板
            </div>
            <div class="code-name">.icon-mianxingtubiao-huigunrenwumoban
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-ruanjianbaoguanli"></span>
            <div class="name">
              面性图标- 软件包管理
            </div>
            <div class="code-name">.icon-mianxingtubiao-ruanjianbaoguanli
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-gongdanyingshe"></span>
            <div class="name">
              面性图标-工单映射
            </div>
            <div class="code-name">.icon-mianxingtubiao-gongdanyingshe
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-kuaisufabumoban"></span>
            <div class="name">
              面性图标-快速发布模板
            </div>
            <div class="code-name">.icon-mianxingtubiao-kuaisufabumoban
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-fenjianrenwu"></span>
            <div class="name">
              面性图标-分拣任务
            </div>
            <div class="code-name">.icon-mianxingtubiao-fenjianrenwu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-mobanji"></span>
            <div class="name">
              面性图标-模板集
            </div>
            <div class="code-name">.icon-mianxingtubiao-mobanji
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-kuaisufabu"></span>
            <div class="name">
              面性图标-快速发布
            </div>
            <div class="code-name">.icon-mianxingtubiao-kuaisufabu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-chengxubaoshu"></span>
            <div class="name">
              面性图标-程序包数
            </div>
            <div class="code-name">.icon-mianxingtubiao-chengxubaoshu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-kuaisuhuigun"></span>
            <div class="name">
              面性图标-快速回滚
            </div>
            <div class="code-name">.icon-mianxingtubiao-kuaisuhuigun
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-peizhiwenjian"></span>
            <div class="name">
              面性图标-配置文件
            </div>
            <div class="code-name">.icon-mianxingtubiao-peizhiwenjian
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-peizhiwenjianshu"></span>
            <div class="name">
              面性图标-配置文件数
            </div>
            <div class="code-name">.icon-mianxingtubiao-peizhiwenjianshu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-yingyongshuliang"></span>
            <div class="name">
              面性图标-应用数量
            </div>
            <div class="code-name">.icon-mianxingtubiao-yingyongshuliang
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-renwuguanli"></span>
            <div class="name">
              面性图标-任务管理
            </div>
            <div class="code-name">.icon-mianxingtubiao-renwuguanli
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-yifabufuwushu"></span>
            <div class="name">
              面性图标-已发布服务数
            </div>
            <div class="code-name">.icon-mianxingtubiao-yifabufuwushu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-SQLbao"></span>
            <div class="name">
              面性图标-SQL包
            </div>
            <div class="code-name">.icon-mianxingtubiao-SQLbao
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-exclamation-circle-shape"></span>
            <div class="name">
              面性图标-警告提醒
            </div>
            <div class="code-name">.icon-exclamation-circle-shape
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-dashboard-shape"></span>
            <div class="name">
              面性图标-图表2
            </div>
            <div class="code-name">.icon-dashboard-shape
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-dashboard-2-shape"></span>
            <div class="name">
              面性图标-图表1
            </div>
            <div class="code-name">.icon-dashboard-2-shape
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-calendar-shape"></span>
            <div class="name">
              面性图标-时间表
            </div>
            <div class="code-name">.icon-calendar-shape
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-zhiding"></span>
            <div class="name">
              面性图标-置顶
            </div>
            <div class="code-name">.icon-zhiding
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-zhidi"></span>
            <div class="name">
              面性图标-置底
            </div>
            <div class="code-name">.icon-zhidi
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-window"></span>
            <div class="name">
              功能性图标-window
            </div>
            <div class="code-name">.icon-window
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-tomcat"></span>
            <div class="name">
              功能性图标-tomcat
            </div>
            <div class="code-name">.icon-tomcat
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mysql"></span>
            <div class="name">
              功能性图标-mysql
            </div>
            <div class="code-name">.icon-mysql
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-linux"></span>
            <div class="name">
              功能性图标-linux
            </div>
            <div class="code-name">.icon-linux
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-duobianxing"></span>
            <div class="name">
              面性图标-卡片图标背景
            </div>
            <div class="code-name">.icon-duobianxing
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-zhiming"></span>
            <div class="name">
              面性图标-致命
            </div>
            <div class="code-name">.icon-zhiming
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-ziwang"></span>
            <div class="name">
              子网
            </div>
            <div class="code-name">.icon-ziwang
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-cipanrongliang1"></span>
            <div class="name">
              面性图标- 磁盘容量
            </div>
            <div class="code-name">.icon-mianxingtubiao-cipanrongliang1
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-fuwuzhongxin1"></span>
            <div class="name">
              面性图标-服务中心
            </div>
            <div class="code-name">.icon-mianxingtubiao-fuwuzhongxin1
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-yueshiyongfuwushu1"></span>
            <div class="name">
              面性图标-月使用服务数
            </div>
            <div class="code-name">.icon-mianxingtubiao-yueshiyongfuwushu1
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-fuwuguanli1"></span>
            <div class="name">
              面性图标-服务管理
            </div>
            <div class="code-name">.icon-mianxingtubiao-fuwuguanli1
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-SLAguanli1"></span>
            <div class="name">
              面性图标-SLA管理
            </div>
            <div class="code-name">.icon-mianxingtubiao-SLAguanli1
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-pingtaiguanli1"></span>
            <div class="name">
              面性图标-平台管理
            </div>
            <div class="code-name">.icon-mianxingtubiao-pingtaiguanli1
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-cunchuguanli"></span>
            <div class="name">
              面性图标-存储管理
            </div>
            <div class="code-name">.icon-mianxingtubiao-cunchuguanli
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-wangluoguanli"></span>
            <div class="name">
              面性图标-网络管理
            </div>
            <div class="code-name">.icon-mianxingtubiao-wangluoguanli
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-zhujiguanli"></span>
            <div class="name">
              面性图标-主机管理
            </div>
            <div class="code-name">.icon-mianxingtubiao-zhujiguanli
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-caozuorizhi1"></span>
            <div class="name">
              面性图标-操作日志
            </div>
            <div class="code-name">.icon-mianxingtubiao-caozuorizhi1
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-fuwumulu"></span>
            <div class="name">
              面性图标-服务目录
            </div>
            <div class="code-name">.icon-mianxingtubiao-fuwumulu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-bumenguanli"></span>
            <div class="name">
              面性图标-部门管理
            </div>
            <div class="code-name">.icon-mianxingtubiao-bumenguanli
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-chengbenfenxi"></span>
            <div class="name">
              面性图标-成本分析
            </div>
            <div class="code-name">.icon-mianxingtubiao-chengbenfenxi
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-ziyuanfenxi"></span>
            <div class="name">
              面性图标-资源分析
            </div>
            <div class="code-name">.icon-mianxingtubiao-ziyuanfenxi
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-xitongshezhi"></span>
            <div class="name">
              面性图标-系统设置
            </div>
            <div class="code-name">.icon-mianxingtubiao-xitongshezhi
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-yewuzhujiguanli"></span>
            <div class="name">
              面性图标-业务主机管理
            </div>
            <div class="code-name">.icon-mianxingtubiao-yewuzhujiguanli
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-ziyuanzhongxin"></span>
            <div class="name">
              面性图标-资源中心
            </div>
            <div class="code-name">.icon-mianxingtubiao-ziyuanzhongxin
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-yunyingzhongxin"></span>
            <div class="name">
              面性图标-运营中心
            </div>
            <div class="code-name">.icon-mianxingtubiao-yunyingzhongxin
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-yunguanli"></span>
            <div class="name">
              面性图标-云管理
            </div>
            <div class="code-name">.icon-mianxingtubiao-yunguanli
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-fuwuzonglan"></span>
            <div class="name">
              面性图标-服务总览
            </div>
            <div class="code-name">.icon-mianxingtubiao-fuwuzonglan
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-zuhuguanli"></span>
            <div class="name">
              面性图标-租户管理
            </div>
            <div class="code-name">.icon-mianxingtubiao-zuhuguanli
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-zuzhiguanli"></span>
            <div class="name">
              面性图标-组织管理
            </div>
            <div class="code-name">.icon-mianxingtubiao-zuzhiguanli
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-gongdanshu"></span>
            <div class="name">
              面性图标-工单数
            </div>
            <div class="code-name">.icon-mianxingtubiao-gongdanshu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-cunchu"></span>
            <div class="name">
              面性图标-存储
            </div>
            <div class="code-name">.icon-mianxingtubiao-cunchu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-fangkuai"></span>
            <div class="name">
              面性图标-方块
            </div>
            <div class="code-name">.icon-mianxingtubiao-fangkuai
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-cunchutong"></span>
            <div class="name">
              面性图标-存储桶
            </div>
            <div class="code-name">.icon-mianxingtubiao-cunchutong
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-anquanzu"></span>
            <div class="name">
              面性图标-安全组
            </div>
            <div class="code-name">.icon-mianxingtubiao-anquanzu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-gongdanguanli"></span>
            <div class="name">
              面性图标-工单管理
            </div>
            <div class="code-name">.icon-mianxingtubiao-gongdanguanli
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-fuwuzongshu"></span>
            <div class="name">
              面性图标-服务总数
            </div>
            <div class="code-name">.icon-mianxingtubiao-fuwuzongshu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-neicun"></span>
            <div class="name">
              面性图标-内存
            </div>
            <div class="code-name">.icon-mianxingtubiao-neicun
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-jingxiang"></span>
            <div class="name">
              面性图标-镜像
            </div>
            <div class="code-name">.icon-mianxingtubiao-jingxiang
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-jiaoseguanli"></span>
            <div class="name">
              面性图标-角色管理
            </div>
            <div class="code-name">.icon-mianxingtubiao-jiaoseguanli
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-shujuku"></span>
            <div class="name">
              面性图标-数据库
            </div>
            <div class="code-name">.icon-mianxingtubiao-shujuku
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-yingpan"></span>
            <div class="name">
              面性图标-硬盘
            </div>
            <div class="code-name">.icon-mianxingtubiao-yingpan
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-zhuji"></span>
            <div class="name">
              面性图标-主机
            </div>
            <div class="code-name">.icon-mianxingtubiao-zhuji
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-kuaizhao"></span>
            <div class="name">
              面性图标-快照
            </div>
            <div class="code-name">.icon-mianxingtubiao-kuaizhao
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-liebiao"></span>
            <div class="name">
              面性图标-列表
            </div>
            <div class="code-name">.icon-mianxingtubiao-liebiao
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-zhihangjilu"></span>
            <div class="name">
              面性图标-执行记录
            </div>
            <div class="code-name">.icon-mianxingtubiao-zhihangjilu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-neicunzongliang"></span>
            <div class="name">
              面性图标- 内存总量
            </div>
            <div class="code-name">.icon-mianxingtubiao-neicunzongliang
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-jisuanjiziyuandangyuexiaofei"></span>
            <div class="name">
              面性图标-计算机资源当月消费
            </div>
            <div class="code-name">.icon-mianxingtubiao-jisuanjiziyuandangyuexiaofei
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-cipandangyuexiaofei"></span>
            <div class="name">
              面性图标-磁盘当月消费
            </div>
            <div class="code-name">.icon-mianxingtubiao-cipandangyuexiaofei
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-zuhuziyuanchi"></span>
            <div class="name">
              面性图标-租户资源池
            </div>
            <div class="code-name">.icon-mianxingtubiao-zuhuziyuanchi
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-gaofengqishezhi"></span>
            <div class="name">
              面性图标-高峰期设置
            </div>
            <div class="code-name">.icon-mianxingtubiao-gaofengqishezhi
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-xiangmuguanli"></span>
            <div class="name">
              面性图标-项目管理
            </div>
            <div class="code-name">.icon-mianxingtubiao-xiangmuguanli
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-rongliangfenxi"></span>
            <div class="name">
              面性图标-容量分析
            </div>
            <div class="code-name">.icon-mianxingtubiao-rongliangfenxi
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-xunijidangyuezongxiaofei"></span>
            <div class="name">
              面性图标-虚拟机当月总消费
            </div>
            <div class="code-name">.icon-mianxingtubiao-xunijidangyuezongxiaofei
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-CPUheshu"></span>
            <div class="name">
              面性图标-CPU核数
            </div>
            <div class="code-name">.icon-mianxingtubiao-CPUheshu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-VPC"></span>
            <div class="name">
              面性图标-VPC
            </div>
            <div class="code-name">.icon-mianxingtubiao-VPC
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-fuwuyunying"></span>
            <div class="name">
              面性图标-服务运营
            </div>
            <div class="code-name">.icon-mianxingtubiao-fuwuyunying
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-liuchengguanli"></span>
            <div class="name">
              面性图标-流程管理
            </div>
            <div class="code-name">.icon-mianxingtubiao-liuchengguanli
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-quanxianguanli"></span>
            <div class="name">
              面性图标-权限管理
            </div>
            <div class="code-name">.icon-mianxingtubiao-quanxianguanli
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-yingyonggailan"></span>
            <div class="name">
              面性图标-应用概览
            </div>
            <div class="code-name">.icon-mianxingtubiao-yingyonggailan
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-xianxingtubiao-kaishi"></span>
            <div class="name">
              线性图标-开始
            </div>
            <div class="code-name">.icon-xianxingtubiao-kaishi
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-xianxingtubiao-zanting"></span>
            <div class="name">
              线性图标-暂停
            </div>
            <div class="code-name">.icon-xianxingtubiao-zanting
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-xianxingtubiao-tingzhi"></span>
            <div class="name">
              线性图标-停止
            </div>
            <div class="code-name">.icon-xianxingtubiao-tingzhi
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-xianxingtubiao-tiaoguo"></span>
            <div class="name">
              线性图标-跳过
            </div>
            <div class="code-name">.icon-xianxingtubiao-tiaoguo
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-xianxingtubiao-shangchuan"></span>
            <div class="name">
              线性图标-上传
            </div>
            <div class="code-name">.icon-xianxingtubiao-shangchuan
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-xianxingtubiao-wenjianjia"></span>
            <div class="name">
              线性图标-文件夹
            </div>
            <div class="code-name">.icon-xianxingtubiao-wenjianjia
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-xianxingtubiao-daochu"></span>
            <div class="name">
              线性图标-导出
            </div>
            <div class="code-name">.icon-xianxingtubiao-daochu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-xianxingtubiao-fenxiang"></span>
            <div class="name">
              线性图标-分享
            </div>
            <div class="code-name">.icon-xianxingtubiao-fenxiang
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-xianxingtubiao-shijianleixing"></span>
            <div class="name">
              线性图标-时间类型
            </div>
            <div class="code-name">.icon-xianxingtubiao-shijianleixing
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-xianxingtubiao-bianjiyibiaoban"></span>
            <div class="name">
              线性图标-编辑仪表板
            </div>
            <div class="code-name">.icon-xianxingtubiao-bianjiyibiaoban
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-xianxingtubiao-dakaiwenjianjia"></span>
            <div class="name">
              线性图标-打开文件夹
            </div>
            <div class="code-name">.icon-xianxingtubiao-dakaiwenjianjia
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-xianxingtubiao-guanlianshezhi"></span>
            <div class="name">
              线性图标-关联设置
            </div>
            <div class="code-name">.icon-xianxingtubiao-guanlianshezhi
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-xianxingtubiao-shuzhileixing"></span>
            <div class="name">
              线性图标-数值类型
            </div>
            <div class="code-name">.icon-xianxingtubiao-shuzhileixing
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-xianxingtubiao-shuaxin2"></span>
            <div class="name">
              线性图标-刷新
            </div>
            <div class="code-name">.icon-xianxingtubiao-shuaxin2
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-xianxingtubiao-yulan"></span>
            <div class="name">
              线性图标-预览
            </div>
            <div class="code-name">.icon-xianxingtubiao-yulan
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-xianxingtubiao-shengchengbaobiao"></span>
            <div class="name">
              线性图标-生成报表
            </div>
            <div class="code-name">.icon-xianxingtubiao-shengchengbaobiao
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-xianxingtubiao-shezhiguolvtiaojian"></span>
            <div class="name">
              线性图标-设置过滤条件
            </div>
            <div class="code-name">.icon-xianxingtubiao-shezhiguolvtiaojian
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-xianxingtubiao-wenben"></span>
            <div class="name">
              线性图标-文本
            </div>
            <div class="code-name">.icon-xianxingtubiao-wenben
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-xianxingtubiao-xinjianziduan"></span>
            <div class="name">
              线性图标-新建字段
            </div>
            <div class="code-name">.icon-xianxingtubiao-xinjianziduan
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-xianxingtubiao-shujuji"></span>
            <div class="name">
              线性图标-数据集
            </div>
            <div class="code-name">.icon-xianxingtubiao-shujuji
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-xianxingtubiao-xuanzeshujuyuan"></span>
            <div class="name">
              线性图标-选择数据源
            </div>
            <div class="code-name">.icon-xianxingtubiao-xuanzeshujuyuan
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-wenti"></span>
            <div class="name">
              面性图标-问题
            </div>
            <div class="code-name">.icon-mianxingtubiao-wenti
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-yingyongpeizhizhongxin"></span>
            <div class="name">
              面性图标-应用配置中心
            </div>
            <div class="code-name">.icon-mianxingtubiao-yingyongpeizhizhongxin
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-quanjushuiyin"></span>
            <div class="name">
              面性图标-全局水印
            </div>
            <div class="code-name">.icon-mianxingtubiao-quanjushuiyin
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-wodeyingyong"></span>
            <div class="name">
              面性图标-我的应用
            </div>
            <div class="code-name">.icon-mianxingtubiao-wodeyingyong
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-caozuorizhi"></span>
            <div class="name">
              面性图标-操作日志
            </div>
            <div class="code-name">.icon-mianxingtubiao-caozuorizhi
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-yonghuguanli"></span>
            <div class="name">
              面性图标-用户管理
            </div>
            <div class="code-name">.icon-mianxingtubiao-yonghuguanli
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-yanzhonggaojing"></span>
            <div class="name">
              面性图标-严重告警
            </div>
            <div class="code-name">.icon-mianxingtubiao-yanzhonggaojing
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-yingyongrizhiguanli"></span>
            <div class="name">
              面性图标-应用日志管理
            </div>
            <div class="code-name">.icon-mianxingtubiao-yingyongrizhiguanli
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-yingyongziyuangaojing"></span>
            <div class="name">
              面性图标-应用资源告警
            </div>
            <div class="code-name">.icon-mianxingtubiao-yingyongziyuangaojing
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-yingyongxunjian"></span>
            <div class="name">
              面性图标-应用巡检
            </div>
            <div class="code-name">.icon-mianxingtubiao-yingyongxunjian
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-yingyongqiting"></span>
            <div class="name">
              面性图标-应用启停
            </div>
            <div class="code-name">.icon-mianxingtubiao-yingyongqiting
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-LOGOshezhi"></span>
            <div class="name">
              面性图标-LOGO设置
            </div>
            <div class="code-name">.icon-mianxingtubiao-LOGOshezhi
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-xianxingtubiao-huifu1"></span>
            <div class="name">
              线性图标-恢复
            </div>
            <div class="code-name">.icon-xianxingtubiao-huifu1
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-xianxingtubiao-duban"></span>
            <div class="name">
              线性图标-督办
            </div>
            <div class="code-name">.icon-xianxingtubiao-duban
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-xianxingtubiao-chufa"></span>
            <div class="name">
              线性图标-触发
            </div>
            <div class="code-name">.icon-xianxingtubiao-chufa
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-renyuanxinxi"></span>
            <div class="name">
              面性图标-人员信息
            </div>
            <div class="code-name">.icon-mianxingtubiao-renyuanxinxi
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-shoucang-xuanzhong"></span>
            <div class="name">
              面性图标-收藏-选中
            </div>
            <div class="code-name">.icon-mianxingtubiao-shoucang-xuanzhong
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-xianxingtubiao-shoucang"></span>
            <div class="name">
              线性图标-收藏
            </div>
            <div class="code-name">.icon-xianxingtubiao-shoucang
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-dangrizuoyeliushu"></span>
            <div class="name">
              面性图标-当日作业流数
            </div>
            <div class="code-name">.icon-mianxingtubiao-dangrizuoyeliushu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-dangrizuoyezongshu"></span>
            <div class="name">
              面性图标-当日作业总数
            </div>
            <div class="code-name">.icon-mianxingtubiao-dangrizuoyezongshu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-xitong"></span>
            <div class="name">
              面性图标-系统
            </div>
            <div class="code-name">.icon-mianxingtubiao-xitong
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-jibenxinxi"></span>
            <div class="name">
              面性图标-基本信息
            </div>
            <div class="code-name">.icon-mianxingtubiao-jibenxinxi
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-renwubianpai"></span>
            <div class="name">
              面性图标-任务编排
            </div>
            <div class="code-name">.icon-mianxingtubiao-renwubianpai
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-zuoye"></span>
            <div class="name">
              面性图标-作业
            </div>
            <div class="code-name">.icon-mianxingtubiao-zuoye
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-shijian1"></span>
            <div class="name">
              面性图标-时间
            </div>
            <div class="code-name">.icon-mianxingtubiao-shijian1
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-gaojingzhongxin"></span>
            <div class="name">
              面性图标-告警中心
            </div>
            <div class="code-name">.icon-mianxingtubiao-gaojingzhongxin
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-jin24xiaoshiwentiduixiang"></span>
            <div class="name">
              面性图标-近24小时问题对象
            </div>
            <div class="code-name">.icon-mianxingtubiao-jin24xiaoshiwentiduixiang
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-zuoyelishi"></span>
            <div class="name">
              面形图标-作业历史
            </div>
            <div class="code-name">.icon-mianxingtubiao-zuoyelishi
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-jiqun"></span>
            <div class="name">
              面性图标-集群
            </div>
            <div class="code-name">.icon-mianxingtubiao-jiqun
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-jiankongduixiangshuliang"></span>
            <div class="name">
              面性图标-监控对象数量
            </div>
            <div class="code-name">.icon-mianxingtubiao-jiankongduixiangshuliang
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-shouye"></span>
            <div class="name">
              面性图标-首页
            </div>
            <div class="code-name">.icon-mianxingtubiao-shouye
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-shijianzhongxin"></span>
            <div class="name">
              面性图标-事件中心
            </div>
            <div class="code-name">.icon-mianxingtubiao-shijianzhongxin
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-yewu"></span>
            <div class="name">
              面性图标-业务
            </div>
            <div class="code-name">.icon-mianxingtubiao-yewu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-yingyongjiankangshitu"></span>
            <div class="name">
              面性图标-应用健康视图
            </div>
            <div class="code-name">.icon-mianxingtubiao-yingyongjiankangshitu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-yingyongqiang"></span>
            <div class="name">
              面性图标-应用墙
            </div>
            <div class="code-name">.icon-mianxingtubiao-yingyongqiang
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-zuoyejiankongdaping"></span>
            <div class="name">
              面性图标-作业监控大屏
            </div>
            <div class="code-name">.icon-mianxingtubiao-zuoyejiankongdaping
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-yingyongjiankongguanli"></span>
            <div class="name">
              面性图标-应用监控管理
            </div>
            <div class="code-name">.icon-mianxingtubiao-yingyongjiankongguanli
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-zuoyeliuguanli"></span>
            <div class="name">
              面性图标-作业流管理
            </div>
            <div class="code-name">.icon-mianxingtubiao-zuoyeliuguanli
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-zuoyeguanli"></span>
            <div class="name">
              面性图标-作业管理
            </div>
            <div class="code-name">.icon-mianxingtubiao-zuoyeguanli
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-zuoyejiankong"></span>
            <div class="name">
              面性图标-作业监控
            </div>
            <div class="code-name">.icon-mianxingtubiao-zuoyejiankong
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-zixitong"></span>
            <div class="name">
              面性图标-子系统
            </div>
            <div class="code-name">.icon-mianxingtubiao-zixitong
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-Agentguanli"></span>
            <div class="name">
              面性图标-Agent 管理
            </div>
            <div class="code-name">.icon-mianxingtubiao-Agentguanli
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-shishijiankangpingfen"></span>
            <div class="name">
              面性图标-实时健康评分
            </div>
            <div class="code-name">.icon-mianxingtubiao-shishijiankangpingfen
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-mokuai"></span>
            <div class="name">
              面性图标-模块
            </div>
            <div class="code-name">.icon-mianxingtubiao-mokuai
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-biaogepaixu"></span>
            <div class="name">
              常用图标-表格排序
            </div>
            <div class="code-name">.icon-changyongtubiao-biaogepaixu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-jiahao"></span>
            <div class="name">
              常用图标-加号
            </div>
            <div class="code-name">.icon-changyongtubiao-jiahao
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-jiantou"></span>
            <div class="name">
              常用图标-箭头
            </div>
            <div class="code-name">.icon-changyongtubiao-jiantou
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-fanhui"></span>
            <div class="name">
              常用图标-返回
            </div>
            <div class="code-name">.icon-changyongtubiao-fanhui
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-shuangjiantou"></span>
            <div class="name">
              常用图标-双箭头
            </div>
            <div class="code-name">.icon-changyongtubiao-shuangjiantou
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-bitianxinghao"></span>
            <div class="name">
              常用图标-必填星号
            </div>
            <div class="code-name">.icon-changyongtubiao-bitianxinghao
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-duihao"></span>
            <div class="name">
              常用图标-对号
            </div>
            <div class="code-name">.icon-changyongtubiao-duihao
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-chahao"></span>
            <div class="name">
              常用图标-叉号
            </div>
            <div class="code-name">.icon-changyongtubiao-chahao
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-jianhao"></span>
            <div class="name">
              常用图标-减号
            </div>
            <div class="code-name">.icon-changyongtubiao-jianhao
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-changyongtubiao-bianji"></span>
            <div class="name">
              常用图标-编辑
            </div>
            <div class="code-name">.icon-changyongtubiao-bianji
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-shijian"></span>
            <div class="name">
              面性图标-时间
            </div>
            <div class="code-name">.icon-mianxingtubiao-shijian
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-shezhi"></span>
            <div class="name">
              面性图标-设置
            </div>
            <div class="code-name">.icon-mianxingtubiao-shezhi
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-sousuo"></span>
            <div class="name">
              面性图标-搜索
            </div>
            <div class="code-name">.icon-mianxingtubiao-sousuo
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-yonghu"></span>
            <div class="name">
              面性图标-用户
            </div>
            <div class="code-name">.icon-mianxingtubiao-yonghu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-zhongzhi"></span>
            <div class="name">
              面性图标-终止
            </div>
            <div class="code-name">.icon-mianxingtubiao-zhongzhi
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-tongzhi"></span>
            <div class="name">
              面性图标-通知
            </div>
            <div class="code-name">.icon-mianxingtubiao-tongzhi
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-tishi"></span>
            <div class="name">
              面性图标-提示
            </div>
            <div class="code-name">.icon-mianxingtubiao-tishi
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-dui"></span>
            <div class="name">
              面性图标-对
            </div>
            <div class="code-name">.icon-mianxingtubiao-dui
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-jiahaoyuan"></span>
            <div class="name">
              面性图标-加号（圆）
            </div>
            <div class="code-name">.icon-mianxingtubiao-jiahaoyuan
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-cuo"></span>
            <div class="name">
              面性图标-错
            </div>
            <div class="code-name">.icon-mianxingtubiao-cuo
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-bohui"></span>
            <div class="name">
              面性图标-驳回
            </div>
            <div class="code-name">.icon-mianxingtubiao-bohui
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-bangzhu"></span>
            <div class="name">
              面性图标-帮助
            </div>
            <div class="code-name">.icon-mianxingtubiao-bangzhu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-jia"></span>
            <div class="name">
              面性图标-加
            </div>
            <div class="code-name">.icon-mianxingtubiao-jia
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-riqi"></span>
            <div class="name">
              面性图标-日期
            </div>
            <div class="code-name">.icon-mianxingtubiao-riqi
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-jian"></span>
            <div class="name">
              面性图标-减
            </div>
            <div class="code-name">.icon-mianxingtubiao-jian
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-shaixuan"></span>
            <div class="name">
              面性图标-筛选
            </div>
            <div class="code-name">.icon-mianxingtubiao-shaixuan
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-jianhaoyuan"></span>
            <div class="name">
              面性图标-减号（圆）
            </div>
            <div class="code-name">.icon-mianxingtubiao-jianhaoyuan
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-jiazai"></span>
            <div class="name">
              面性图标-加载
            </div>
            <div class="code-name">.icon-mianxingtubiao-jiazai
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianxingtubiao-quanping"></span>
            <div class="name">
              面性图标-全屏
            </div>
            <div class="code-name">.icon-mianxingtubiao-quanping
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-xianxingtubiao-chedan"></span>
            <div class="name">
              线性图标-撤单
            </div>
            <div class="code-name">.icon-xianxingtubiao-chedan
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-xianxingtubiao-dayin"></span>
            <div class="name">
              线性图标-打印
            </div>
            <div class="code-name">.icon-xianxingtubiao-dayin
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-xianxingtubiao-jiahaoyuan"></span>
            <div class="name">
              线性图标-加号（圆）
            </div>
            <div class="code-name">.icon-xianxingtubiao-jiahaoyuan
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-xianxingtubiao-fujian"></span>
            <div class="name">
              线性图标-附件
            </div>
            <div class="code-name">.icon-xianxingtubiao-fujian
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-xianxingtubiao-guaqi"></span>
            <div class="name">
              线性图标-挂起
            </div>
            <div class="code-name">.icon-xianxingtubiao-guaqi
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-xianxingtubiao-xiazai"></span>
            <div class="name">
              线性图标-下载
            </div>
            <div class="code-name">.icon-xianxingtubiao-xiazai
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-xianxingtubiao-jianhaoyuan"></span>
            <div class="name">
              线性图标-减号（圆）
            </div>
            <div class="code-name">.icon-xianxingtubiao-jianhaoyuan
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-xianxingtubiao-baocun"></span>
            <div class="name">
              线性图标-保存
            </div>
            <div class="code-name">.icon-xianxingtubiao-baocun
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-xianxingtubiao-bukejian"></span>
            <div class="name">
              线性图标-不可见
            </div>
            <div class="code-name">.icon-xianxingtubiao-bukejian
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-xianxingtubiao-quanping1"></span>
            <div class="name">
              线性图标-全屏
            </div>
            <div class="code-name">.icon-xianxingtubiao-quanping1
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-xianxingtubiao-huifu"></span>
            <div class="name">
              线性图标-回复
            </div>
            <div class="code-name">.icon-xianxingtubiao-huifu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-xianxingtubiao-huanyuan"></span>
            <div class="name">
              线性图标-还原
            </div>
            <div class="code-name">.icon-xianxingtubiao-huanyuan
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-xianxingtubiao-kejian"></span>
            <div class="name">
              线性图标-可见
            </div>
            <div class="code-name">.icon-xianxingtubiao-kejian
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-xianxingtubiao-yijianbianpai"></span>
            <div class="name">
              线性图标-一键编排
            </div>
            <div class="code-name">.icon-xianxingtubiao-yijianbianpai
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-xianxingtubiao-fuwei"></span>
            <div class="name">
              线性图标-复位
            </div>
            <div class="code-name">.icon-xianxingtubiao-fuwei
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-xianxingtubiao-jian"></span>
            <div class="name">
              线性图标-减
            </div>
            <div class="code-name">.icon-xianxingtubiao-jian
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-xianxingtubiao-jia"></span>
            <div class="name">
              线性图标-加
            </div>
            <div class="code-name">.icon-xianxingtubiao-jia
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-xianxingtubiao-bohui"></span>
            <div class="name">
              线性图标-驳回
            </div>
            <div class="code-name">.icon-xianxingtubiao-bohui
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-xianxingtubiao-tishi1"></span>
            <div class="name">
              线性图标-提示
            </div>
            <div class="code-name">.icon-xianxingtubiao-tishi1
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-xianxingtubiao-zhongzhi"></span>
            <div class="name">
              线性图标-终止
            </div>
            <div class="code-name">.icon-xianxingtubiao-zhongzhi
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-xianxingtubiao-dianzan"></span>
            <div class="name">
              线性图标-点赞
            </div>
            <div class="code-name">.icon-xianxingtubiao-dianzan
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-xianxingtubiao-zujianjiagou"></span>
            <div class="name">
              线性图标-组件架构
            </div>
            <div class="code-name">.icon-xianxingtubiao-zujianjiagou
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-xianxingtubiao-riqi"></span>
            <div class="name">
              线性图标-日期
            </div>
            <div class="code-name">.icon-xianxingtubiao-riqi
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-xianxingtubiao-shijian1"></span>
            <div class="name">
              线性图标-时间
            </div>
            <div class="code-name">.icon-xianxingtubiao-shijian1
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-xianxingtubiao-dui"></span>
            <div class="name">
              线性图标-对
            </div>
            <div class="code-name">.icon-xianxingtubiao-dui
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-xianxingtubiao-cuo"></span>
            <div class="name">
              线性图标-错
            </div>
            <div class="code-name">.icon-xianxingtubiao-cuo
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-xianxingtubiao-wenjian"></span>
            <div class="name">
              线性图标-文件
            </div>
            <div class="code-name">.icon-xianxingtubiao-wenjian
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-xianxingtubiao-sousuo"></span>
            <div class="name">
              线性图标-搜索
            </div>
            <div class="code-name">.icon-xianxingtubiao-sousuo
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-xianxingtubiao-lishijilu"></span>
            <div class="name">
              线性图标-历史记录
            </div>
            <div class="code-name">.icon-xianxingtubiao-lishijilu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-xianxingtubiao-bangzhu"></span>
            <div class="name">
              线性图标-帮助
            </div>
            <div class="code-name">.icon-xianxingtubiao-bangzhu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-xianxingtubiao-fuzhi"></span>
            <div class="name">
              线性图标-复制
            </div>
            <div class="code-name">.icon-xianxingtubiao-fuzhi
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-xianxingtubiao-guanbigongdan"></span>
            <div class="name">
              线性图标-关闭工单
            </div>
            <div class="code-name">.icon-xianxingtubiao-guanbigongdan
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-xianxingtubiao-tishi"></span>
            <div class="name">
              线性图标-提示
            </div>
            <div class="code-name">.icon-xianxingtubiao-tishi
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-xianxingtubiao-tongzhi"></span>
            <div class="name">
              线性图标-通知
            </div>
            <div class="code-name">.icon-xianxingtubiao-tongzhi
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-xianxingtubiao-shezhi"></span>
            <div class="name">
              线性图标-设置
            </div>
            <div class="code-name">.icon-xianxingtubiao-shezhi
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-xianxingtubiao-yonghu"></span>
            <div class="name">
              线性图标-用户
            </div>
            <div class="code-name">.icon-xianxingtubiao-yonghu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-xianxingtubiao-lashen"></span>
            <div class="name">
              线性图标-拉伸
            </div>
            <div class="code-name">.icon-xianxingtubiao-lashen
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-xianxingtubiao-shanchu"></span>
            <div class="name">
              线性图标-删除
            </div>
            <div class="code-name">.icon-xianxingtubiao-shanchu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-xianxingtubiao-zhankai"></span>
            <div class="name">
              线性图标-展开
            </div>
            <div class="code-name">.icon-xianxingtubiao-zhankai
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-xianxingtubiao-shouqi"></span>
            <div class="name">
              线性图标-收起
            </div>
            <div class="code-name">.icon-xianxingtubiao-shouqi
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-xianxingtubiao-tiaozhuan1"></span>
            <div class="name">
              线性图标-跳转
            </div>
            <div class="code-name">.icon-xianxingtubiao-tiaozhuan1
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-xianxingtubiao-tuodong"></span>
            <div class="name">
              线性图标-拖动
            </div>
            <div class="code-name">.icon-xianxingtubiao-tuodong
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-xianxingtubiao-shijian"></span>
            <div class="name">
              线性图标-时间
            </div>
            <div class="code-name">.icon-xianxingtubiao-shijian
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-xianxingtubiao-quanping"></span>
            <div class="name">
              线性图标-全屏
            </div>
            <div class="code-name">.icon-xianxingtubiao-quanping
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-xianxingtubiao-gengduo1"></span>
            <div class="name">
              线性图标-更多
            </div>
            <div class="code-name">.icon-xianxingtubiao-gengduo1
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-xianxingtubiao-ketuodong1"></span>
            <div class="name">
              线性图标-可拖动
            </div>
            <div class="code-name">.icon-xianxingtubiao-ketuodong1
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-xianxingtubiao-miaozhun"></span>
            <div class="name">
              线性图标-瞄准
            </div>
            <div class="code-name">.icon-xianxingtubiao-miaozhun
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-xianxingtubiao-paixu"></span>
            <div class="name">
              线性图标-排序
            </div>
            <div class="code-name">.icon-xianxingtubiao-paixu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-xianxingtubiao-piliangbianji"></span>
            <div class="name">
              线性图标-批量编辑
            </div>
            <div class="code-name">.icon-xianxingtubiao-piliangbianji
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-xianxingtubiao-shezhi2"></span>
            <div class="name">
              线性图标-设置2
            </div>
            <div class="code-name">.icon-xianxingtubiao-shezhi2
            </div>
          </li>
          
        </ul>
        <div class="article markdown">
        <h2 id="font-class-">font-class 引用</h2>
        <hr>

        <p>font-class 是 Unicode 使用方式的一种变种，主要是解决 Unicode 书写不直观，语意不明确的问题。</p>
        <p>与 Unicode 使用方式相比，具有如下特点：</p>
        <ul>
          <li>相比于 Unicode 语意明确，书写更直观。可以很容易分辨这个 icon 是什么。</li>
          <li>因为使用 class 来定义图标，所以当要替换图标时，只需要修改 class 里面的 Unicode 引用。</li>
        </ul>
        <p>使用步骤如下：</p>
        <h3 id="-fontclass-">第一步：引入项目下面生成的 fontclass 代码：</h3>
<pre><code class="language-html">&lt;link rel="stylesheet" href="./iconfont.css"&gt;
</code></pre>
        <h3 id="-">第二步：挑选相应图标并获取类名，应用于页面：</h3>
<pre><code class="language-html">&lt;span class="iconfont icon-xxx"&gt;&lt;/span&gt;
</code></pre>
        <blockquote>
          <p>"
            iconfont" 是你项目下的 font-family。可以通过编辑项目查看，默认是 "iconfont"。</p>
        </blockquote>
      </div>
      </div>
      <div class="content symbol">
          <ul class="icon_lists dib-box">
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-piliangzuoyeliudaoru"></use>
                </svg>
                <div class="name">面性图标-批量作业流导入</div>
                <div class="code-name">#icon-mianxingtubiao-piliangzuoyeliudaoru</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-piliangzuoyedaoru"></use>
                </svg>
                <div class="name">面性图标-批量作业导入</div>
                <div class="code-name">#icon-mianxingtubiao-piliangzuoyedaoru</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-xinjiandangezuoye"></use>
                </svg>
                <div class="name">面性图标-新建单个作业</div>
                <div class="code-name">#icon-mianxingtubiao-xinjiandangezuoye</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-xinjiandangezuoyeliu"></use>
                </svg>
                <div class="name">面性图标-新建单个作业流</div>
                <div class="code-name">#icon-mianxingtubiao-xinjiandangezuoyeliu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-yunpingtaijiankong"></use>
                </svg>
                <div class="name">面性图标-云平台监控</div>
                <div class="code-name">#icon-yunpingtaijiankong</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-xianxingtubiao-suoding"></use>
                </svg>
                <div class="name">线性图标-锁定</div>
                <div class="code-name">#icon-xianxingtubiao-suoding</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-daichuligongdan"></use>
                </svg>
                <div class="name">面性图标-待处理工单</div>
                <div class="code-name">#icon-mianxingtubiao-daichuligongdan</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-yingyongguanli"></use>
                </svg>
                <div class="name">面性图标-应用管理</div>
                <div class="code-name">#icon-mianxingtubiao-yingyongguanli</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-fuwuyuezhuceshu"></use>
                </svg>
                <div class="name">面性图标- 服务月注册数</div>
                <div class="code-name">#icon-mianxingtubiao-fuwuyuezhuceshu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-zhihanglishi"></use>
                </svg>
                <div class="name">面性图标- 执行历史</div>
                <div class="code-name">#icon-mianxingtubiao-zhihanglishi</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-chengxubao"></use>
                </svg>
                <div class="name">面性图标-程序包</div>
                <div class="code-name">#icon-mianxingtubiao-chengxubao</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-huigunrenwumoban"></use>
                </svg>
                <div class="name">面性图标- 回滚任务模板</div>
                <div class="code-name">#icon-mianxingtubiao-huigunrenwumoban</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-ruanjianbaoguanli"></use>
                </svg>
                <div class="name">面性图标- 软件包管理</div>
                <div class="code-name">#icon-mianxingtubiao-ruanjianbaoguanli</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-gongdanyingshe"></use>
                </svg>
                <div class="name">面性图标-工单映射</div>
                <div class="code-name">#icon-mianxingtubiao-gongdanyingshe</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-kuaisufabumoban"></use>
                </svg>
                <div class="name">面性图标-快速发布模板</div>
                <div class="code-name">#icon-mianxingtubiao-kuaisufabumoban</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-fenjianrenwu"></use>
                </svg>
                <div class="name">面性图标-分拣任务</div>
                <div class="code-name">#icon-mianxingtubiao-fenjianrenwu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-mobanji"></use>
                </svg>
                <div class="name">面性图标-模板集</div>
                <div class="code-name">#icon-mianxingtubiao-mobanji</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-kuaisufabu"></use>
                </svg>
                <div class="name">面性图标-快速发布</div>
                <div class="code-name">#icon-mianxingtubiao-kuaisufabu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-chengxubaoshu"></use>
                </svg>
                <div class="name">面性图标-程序包数</div>
                <div class="code-name">#icon-mianxingtubiao-chengxubaoshu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-kuaisuhuigun"></use>
                </svg>
                <div class="name">面性图标-快速回滚</div>
                <div class="code-name">#icon-mianxingtubiao-kuaisuhuigun</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-peizhiwenjian"></use>
                </svg>
                <div class="name">面性图标-配置文件</div>
                <div class="code-name">#icon-mianxingtubiao-peizhiwenjian</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-peizhiwenjianshu"></use>
                </svg>
                <div class="name">面性图标-配置文件数</div>
                <div class="code-name">#icon-mianxingtubiao-peizhiwenjianshu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-yingyongshuliang"></use>
                </svg>
                <div class="name">面性图标-应用数量</div>
                <div class="code-name">#icon-mianxingtubiao-yingyongshuliang</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-renwuguanli"></use>
                </svg>
                <div class="name">面性图标-任务管理</div>
                <div class="code-name">#icon-mianxingtubiao-renwuguanli</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-yifabufuwushu"></use>
                </svg>
                <div class="name">面性图标-已发布服务数</div>
                <div class="code-name">#icon-mianxingtubiao-yifabufuwushu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-SQLbao"></use>
                </svg>
                <div class="name">面性图标-SQL包</div>
                <div class="code-name">#icon-mianxingtubiao-SQLbao</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-exclamation-circle-shape"></use>
                </svg>
                <div class="name">面性图标-警告提醒</div>
                <div class="code-name">#icon-exclamation-circle-shape</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-dashboard-shape"></use>
                </svg>
                <div class="name">面性图标-图表2</div>
                <div class="code-name">#icon-dashboard-shape</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-dashboard-2-shape"></use>
                </svg>
                <div class="name">面性图标-图表1</div>
                <div class="code-name">#icon-dashboard-2-shape</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-calendar-shape"></use>
                </svg>
                <div class="name">面性图标-时间表</div>
                <div class="code-name">#icon-calendar-shape</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-zhiding"></use>
                </svg>
                <div class="name">面性图标-置顶</div>
                <div class="code-name">#icon-zhiding</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-zhidi"></use>
                </svg>
                <div class="name">面性图标-置底</div>
                <div class="code-name">#icon-zhidi</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-window"></use>
                </svg>
                <div class="name">功能性图标-window</div>
                <div class="code-name">#icon-window</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-tomcat"></use>
                </svg>
                <div class="name">功能性图标-tomcat</div>
                <div class="code-name">#icon-tomcat</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mysql"></use>
                </svg>
                <div class="name">功能性图标-mysql</div>
                <div class="code-name">#icon-mysql</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-linux"></use>
                </svg>
                <div class="name">功能性图标-linux</div>
                <div class="code-name">#icon-linux</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-duobianxing"></use>
                </svg>
                <div class="name">面性图标-卡片图标背景</div>
                <div class="code-name">#icon-duobianxing</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-zhiming"></use>
                </svg>
                <div class="name">面性图标-致命</div>
                <div class="code-name">#icon-zhiming</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-ziwang"></use>
                </svg>
                <div class="name">子网</div>
                <div class="code-name">#icon-ziwang</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-cipanrongliang1"></use>
                </svg>
                <div class="name">面性图标- 磁盘容量</div>
                <div class="code-name">#icon-mianxingtubiao-cipanrongliang1</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-fuwuzhongxin1"></use>
                </svg>
                <div class="name">面性图标-服务中心</div>
                <div class="code-name">#icon-mianxingtubiao-fuwuzhongxin1</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-yueshiyongfuwushu1"></use>
                </svg>
                <div class="name">面性图标-月使用服务数</div>
                <div class="code-name">#icon-mianxingtubiao-yueshiyongfuwushu1</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-fuwuguanli1"></use>
                </svg>
                <div class="name">面性图标-服务管理</div>
                <div class="code-name">#icon-mianxingtubiao-fuwuguanli1</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-SLAguanli1"></use>
                </svg>
                <div class="name">面性图标-SLA管理</div>
                <div class="code-name">#icon-mianxingtubiao-SLAguanli1</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-pingtaiguanli1"></use>
                </svg>
                <div class="name">面性图标-平台管理</div>
                <div class="code-name">#icon-mianxingtubiao-pingtaiguanli1</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-cunchuguanli"></use>
                </svg>
                <div class="name">面性图标-存储管理</div>
                <div class="code-name">#icon-mianxingtubiao-cunchuguanli</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-wangluoguanli"></use>
                </svg>
                <div class="name">面性图标-网络管理</div>
                <div class="code-name">#icon-mianxingtubiao-wangluoguanli</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-zhujiguanli"></use>
                </svg>
                <div class="name">面性图标-主机管理</div>
                <div class="code-name">#icon-mianxingtubiao-zhujiguanli</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-caozuorizhi1"></use>
                </svg>
                <div class="name">面性图标-操作日志</div>
                <div class="code-name">#icon-mianxingtubiao-caozuorizhi1</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-fuwumulu"></use>
                </svg>
                <div class="name">面性图标-服务目录</div>
                <div class="code-name">#icon-mianxingtubiao-fuwumulu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-bumenguanli"></use>
                </svg>
                <div class="name">面性图标-部门管理</div>
                <div class="code-name">#icon-mianxingtubiao-bumenguanli</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-chengbenfenxi"></use>
                </svg>
                <div class="name">面性图标-成本分析</div>
                <div class="code-name">#icon-mianxingtubiao-chengbenfenxi</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-ziyuanfenxi"></use>
                </svg>
                <div class="name">面性图标-资源分析</div>
                <div class="code-name">#icon-mianxingtubiao-ziyuanfenxi</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-xitongshezhi"></use>
                </svg>
                <div class="name">面性图标-系统设置</div>
                <div class="code-name">#icon-mianxingtubiao-xitongshezhi</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-yewuzhujiguanli"></use>
                </svg>
                <div class="name">面性图标-业务主机管理</div>
                <div class="code-name">#icon-mianxingtubiao-yewuzhujiguanli</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-ziyuanzhongxin"></use>
                </svg>
                <div class="name">面性图标-资源中心</div>
                <div class="code-name">#icon-mianxingtubiao-ziyuanzhongxin</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-yunyingzhongxin"></use>
                </svg>
                <div class="name">面性图标-运营中心</div>
                <div class="code-name">#icon-mianxingtubiao-yunyingzhongxin</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-yunguanli"></use>
                </svg>
                <div class="name">面性图标-云管理</div>
                <div class="code-name">#icon-mianxingtubiao-yunguanli</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-fuwuzonglan"></use>
                </svg>
                <div class="name">面性图标-服务总览</div>
                <div class="code-name">#icon-mianxingtubiao-fuwuzonglan</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-zuhuguanli"></use>
                </svg>
                <div class="name">面性图标-租户管理</div>
                <div class="code-name">#icon-mianxingtubiao-zuhuguanli</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-zuzhiguanli"></use>
                </svg>
                <div class="name">面性图标-组织管理</div>
                <div class="code-name">#icon-mianxingtubiao-zuzhiguanli</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-gongdanshu"></use>
                </svg>
                <div class="name">面性图标-工单数</div>
                <div class="code-name">#icon-mianxingtubiao-gongdanshu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-cunchu"></use>
                </svg>
                <div class="name">面性图标-存储</div>
                <div class="code-name">#icon-mianxingtubiao-cunchu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-fangkuai"></use>
                </svg>
                <div class="name">面性图标-方块</div>
                <div class="code-name">#icon-mianxingtubiao-fangkuai</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-cunchutong"></use>
                </svg>
                <div class="name">面性图标-存储桶</div>
                <div class="code-name">#icon-mianxingtubiao-cunchutong</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-anquanzu"></use>
                </svg>
                <div class="name">面性图标-安全组</div>
                <div class="code-name">#icon-mianxingtubiao-anquanzu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-gongdanguanli"></use>
                </svg>
                <div class="name">面性图标-工单管理</div>
                <div class="code-name">#icon-mianxingtubiao-gongdanguanli</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-fuwuzongshu"></use>
                </svg>
                <div class="name">面性图标-服务总数</div>
                <div class="code-name">#icon-mianxingtubiao-fuwuzongshu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-neicun"></use>
                </svg>
                <div class="name">面性图标-内存</div>
                <div class="code-name">#icon-mianxingtubiao-neicun</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-jingxiang"></use>
                </svg>
                <div class="name">面性图标-镜像</div>
                <div class="code-name">#icon-mianxingtubiao-jingxiang</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-jiaoseguanli"></use>
                </svg>
                <div class="name">面性图标-角色管理</div>
                <div class="code-name">#icon-mianxingtubiao-jiaoseguanli</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-shujuku"></use>
                </svg>
                <div class="name">面性图标-数据库</div>
                <div class="code-name">#icon-mianxingtubiao-shujuku</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-yingpan"></use>
                </svg>
                <div class="name">面性图标-硬盘</div>
                <div class="code-name">#icon-mianxingtubiao-yingpan</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-zhuji"></use>
                </svg>
                <div class="name">面性图标-主机</div>
                <div class="code-name">#icon-mianxingtubiao-zhuji</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-kuaizhao"></use>
                </svg>
                <div class="name">面性图标-快照</div>
                <div class="code-name">#icon-mianxingtubiao-kuaizhao</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-liebiao"></use>
                </svg>
                <div class="name">面性图标-列表</div>
                <div class="code-name">#icon-mianxingtubiao-liebiao</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-zhihangjilu"></use>
                </svg>
                <div class="name">面性图标-执行记录</div>
                <div class="code-name">#icon-mianxingtubiao-zhihangjilu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-neicunzongliang"></use>
                </svg>
                <div class="name">面性图标- 内存总量</div>
                <div class="code-name">#icon-mianxingtubiao-neicunzongliang</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-jisuanjiziyuandangyuexiaofei"></use>
                </svg>
                <div class="name">面性图标-计算机资源当月消费</div>
                <div class="code-name">#icon-mianxingtubiao-jisuanjiziyuandangyuexiaofei</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-cipandangyuexiaofei"></use>
                </svg>
                <div class="name">面性图标-磁盘当月消费</div>
                <div class="code-name">#icon-mianxingtubiao-cipandangyuexiaofei</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-zuhuziyuanchi"></use>
                </svg>
                <div class="name">面性图标-租户资源池</div>
                <div class="code-name">#icon-mianxingtubiao-zuhuziyuanchi</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-gaofengqishezhi"></use>
                </svg>
                <div class="name">面性图标-高峰期设置</div>
                <div class="code-name">#icon-mianxingtubiao-gaofengqishezhi</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-xiangmuguanli"></use>
                </svg>
                <div class="name">面性图标-项目管理</div>
                <div class="code-name">#icon-mianxingtubiao-xiangmuguanli</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-rongliangfenxi"></use>
                </svg>
                <div class="name">面性图标-容量分析</div>
                <div class="code-name">#icon-mianxingtubiao-rongliangfenxi</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-xunijidangyuezongxiaofei"></use>
                </svg>
                <div class="name">面性图标-虚拟机当月总消费</div>
                <div class="code-name">#icon-mianxingtubiao-xunijidangyuezongxiaofei</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-CPUheshu"></use>
                </svg>
                <div class="name">面性图标-CPU核数</div>
                <div class="code-name">#icon-mianxingtubiao-CPUheshu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-VPC"></use>
                </svg>
                <div class="name">面性图标-VPC</div>
                <div class="code-name">#icon-mianxingtubiao-VPC</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-fuwuyunying"></use>
                </svg>
                <div class="name">面性图标-服务运营</div>
                <div class="code-name">#icon-mianxingtubiao-fuwuyunying</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-liuchengguanli"></use>
                </svg>
                <div class="name">面性图标-流程管理</div>
                <div class="code-name">#icon-mianxingtubiao-liuchengguanli</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-quanxianguanli"></use>
                </svg>
                <div class="name">面性图标-权限管理</div>
                <div class="code-name">#icon-mianxingtubiao-quanxianguanli</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-yingyonggailan"></use>
                </svg>
                <div class="name">面性图标-应用概览</div>
                <div class="code-name">#icon-mianxingtubiao-yingyonggailan</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-xianxingtubiao-kaishi"></use>
                </svg>
                <div class="name">线性图标-开始</div>
                <div class="code-name">#icon-xianxingtubiao-kaishi</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-xianxingtubiao-zanting"></use>
                </svg>
                <div class="name">线性图标-暂停</div>
                <div class="code-name">#icon-xianxingtubiao-zanting</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-xianxingtubiao-tingzhi"></use>
                </svg>
                <div class="name">线性图标-停止</div>
                <div class="code-name">#icon-xianxingtubiao-tingzhi</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-xianxingtubiao-tiaoguo"></use>
                </svg>
                <div class="name">线性图标-跳过</div>
                <div class="code-name">#icon-xianxingtubiao-tiaoguo</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-xianxingtubiao-shangchuan"></use>
                </svg>
                <div class="name">线性图标-上传</div>
                <div class="code-name">#icon-xianxingtubiao-shangchuan</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-xianxingtubiao-wenjianjia"></use>
                </svg>
                <div class="name">线性图标-文件夹</div>
                <div class="code-name">#icon-xianxingtubiao-wenjianjia</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-xianxingtubiao-daochu"></use>
                </svg>
                <div class="name">线性图标-导出</div>
                <div class="code-name">#icon-xianxingtubiao-daochu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-xianxingtubiao-fenxiang"></use>
                </svg>
                <div class="name">线性图标-分享</div>
                <div class="code-name">#icon-xianxingtubiao-fenxiang</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-xianxingtubiao-shijianleixing"></use>
                </svg>
                <div class="name">线性图标-时间类型</div>
                <div class="code-name">#icon-xianxingtubiao-shijianleixing</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-xianxingtubiao-bianjiyibiaoban"></use>
                </svg>
                <div class="name">线性图标-编辑仪表板</div>
                <div class="code-name">#icon-xianxingtubiao-bianjiyibiaoban</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-xianxingtubiao-dakaiwenjianjia"></use>
                </svg>
                <div class="name">线性图标-打开文件夹</div>
                <div class="code-name">#icon-xianxingtubiao-dakaiwenjianjia</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-xianxingtubiao-guanlianshezhi"></use>
                </svg>
                <div class="name">线性图标-关联设置</div>
                <div class="code-name">#icon-xianxingtubiao-guanlianshezhi</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-xianxingtubiao-shuzhileixing"></use>
                </svg>
                <div class="name">线性图标-数值类型</div>
                <div class="code-name">#icon-xianxingtubiao-shuzhileixing</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-xianxingtubiao-shuaxin2"></use>
                </svg>
                <div class="name">线性图标-刷新</div>
                <div class="code-name">#icon-xianxingtubiao-shuaxin2</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-xianxingtubiao-yulan"></use>
                </svg>
                <div class="name">线性图标-预览</div>
                <div class="code-name">#icon-xianxingtubiao-yulan</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-xianxingtubiao-shengchengbaobiao"></use>
                </svg>
                <div class="name">线性图标-生成报表</div>
                <div class="code-name">#icon-xianxingtubiao-shengchengbaobiao</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-xianxingtubiao-shezhiguolvtiaojian"></use>
                </svg>
                <div class="name">线性图标-设置过滤条件</div>
                <div class="code-name">#icon-xianxingtubiao-shezhiguolvtiaojian</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-xianxingtubiao-wenben"></use>
                </svg>
                <div class="name">线性图标-文本</div>
                <div class="code-name">#icon-xianxingtubiao-wenben</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-xianxingtubiao-xinjianziduan"></use>
                </svg>
                <div class="name">线性图标-新建字段</div>
                <div class="code-name">#icon-xianxingtubiao-xinjianziduan</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-xianxingtubiao-shujuji"></use>
                </svg>
                <div class="name">线性图标-数据集</div>
                <div class="code-name">#icon-xianxingtubiao-shujuji</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-xianxingtubiao-xuanzeshujuyuan"></use>
                </svg>
                <div class="name">线性图标-选择数据源</div>
                <div class="code-name">#icon-xianxingtubiao-xuanzeshujuyuan</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-wenti"></use>
                </svg>
                <div class="name">面性图标-问题</div>
                <div class="code-name">#icon-mianxingtubiao-wenti</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-yingyongpeizhizhongxin"></use>
                </svg>
                <div class="name">面性图标-应用配置中心</div>
                <div class="code-name">#icon-mianxingtubiao-yingyongpeizhizhongxin</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-quanjushuiyin"></use>
                </svg>
                <div class="name">面性图标-全局水印</div>
                <div class="code-name">#icon-mianxingtubiao-quanjushuiyin</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-wodeyingyong"></use>
                </svg>
                <div class="name">面性图标-我的应用</div>
                <div class="code-name">#icon-mianxingtubiao-wodeyingyong</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-caozuorizhi"></use>
                </svg>
                <div class="name">面性图标-操作日志</div>
                <div class="code-name">#icon-mianxingtubiao-caozuorizhi</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-yonghuguanli"></use>
                </svg>
                <div class="name">面性图标-用户管理</div>
                <div class="code-name">#icon-mianxingtubiao-yonghuguanli</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-yanzhonggaojing"></use>
                </svg>
                <div class="name">面性图标-严重告警</div>
                <div class="code-name">#icon-mianxingtubiao-yanzhonggaojing</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-yingyongrizhiguanli"></use>
                </svg>
                <div class="name">面性图标-应用日志管理</div>
                <div class="code-name">#icon-mianxingtubiao-yingyongrizhiguanli</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-yingyongziyuangaojing"></use>
                </svg>
                <div class="name">面性图标-应用资源告警</div>
                <div class="code-name">#icon-mianxingtubiao-yingyongziyuangaojing</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-yingyongxunjian"></use>
                </svg>
                <div class="name">面性图标-应用巡检</div>
                <div class="code-name">#icon-mianxingtubiao-yingyongxunjian</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-yingyongqiting"></use>
                </svg>
                <div class="name">面性图标-应用启停</div>
                <div class="code-name">#icon-mianxingtubiao-yingyongqiting</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-LOGOshezhi"></use>
                </svg>
                <div class="name">面性图标-LOGO设置</div>
                <div class="code-name">#icon-mianxingtubiao-LOGOshezhi</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-xianxingtubiao-huifu1"></use>
                </svg>
                <div class="name">线性图标-恢复</div>
                <div class="code-name">#icon-xianxingtubiao-huifu1</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-xianxingtubiao-duban"></use>
                </svg>
                <div class="name">线性图标-督办</div>
                <div class="code-name">#icon-xianxingtubiao-duban</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-xianxingtubiao-chufa"></use>
                </svg>
                <div class="name">线性图标-触发</div>
                <div class="code-name">#icon-xianxingtubiao-chufa</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-renyuanxinxi"></use>
                </svg>
                <div class="name">面性图标-人员信息</div>
                <div class="code-name">#icon-mianxingtubiao-renyuanxinxi</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-shoucang-xuanzhong"></use>
                </svg>
                <div class="name">面性图标-收藏-选中</div>
                <div class="code-name">#icon-mianxingtubiao-shoucang-xuanzhong</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-xianxingtubiao-shoucang"></use>
                </svg>
                <div class="name">线性图标-收藏</div>
                <div class="code-name">#icon-xianxingtubiao-shoucang</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-dangrizuoyeliushu"></use>
                </svg>
                <div class="name">面性图标-当日作业流数</div>
                <div class="code-name">#icon-mianxingtubiao-dangrizuoyeliushu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-dangrizuoyezongshu"></use>
                </svg>
                <div class="name">面性图标-当日作业总数</div>
                <div class="code-name">#icon-mianxingtubiao-dangrizuoyezongshu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-xitong"></use>
                </svg>
                <div class="name">面性图标-系统</div>
                <div class="code-name">#icon-mianxingtubiao-xitong</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-jibenxinxi"></use>
                </svg>
                <div class="name">面性图标-基本信息</div>
                <div class="code-name">#icon-mianxingtubiao-jibenxinxi</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-renwubianpai"></use>
                </svg>
                <div class="name">面性图标-任务编排</div>
                <div class="code-name">#icon-mianxingtubiao-renwubianpai</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-zuoye"></use>
                </svg>
                <div class="name">面性图标-作业</div>
                <div class="code-name">#icon-mianxingtubiao-zuoye</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-shijian1"></use>
                </svg>
                <div class="name">面性图标-时间</div>
                <div class="code-name">#icon-mianxingtubiao-shijian1</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-gaojingzhongxin"></use>
                </svg>
                <div class="name">面性图标-告警中心</div>
                <div class="code-name">#icon-mianxingtubiao-gaojingzhongxin</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-jin24xiaoshiwentiduixiang"></use>
                </svg>
                <div class="name">面性图标-近24小时问题对象</div>
                <div class="code-name">#icon-mianxingtubiao-jin24xiaoshiwentiduixiang</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-zuoyelishi"></use>
                </svg>
                <div class="name">面形图标-作业历史</div>
                <div class="code-name">#icon-mianxingtubiao-zuoyelishi</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-jiqun"></use>
                </svg>
                <div class="name">面性图标-集群</div>
                <div class="code-name">#icon-mianxingtubiao-jiqun</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-jiankongduixiangshuliang"></use>
                </svg>
                <div class="name">面性图标-监控对象数量</div>
                <div class="code-name">#icon-mianxingtubiao-jiankongduixiangshuliang</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-shouye"></use>
                </svg>
                <div class="name">面性图标-首页</div>
                <div class="code-name">#icon-mianxingtubiao-shouye</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-shijianzhongxin"></use>
                </svg>
                <div class="name">面性图标-事件中心</div>
                <div class="code-name">#icon-mianxingtubiao-shijianzhongxin</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-yewu"></use>
                </svg>
                <div class="name">面性图标-业务</div>
                <div class="code-name">#icon-mianxingtubiao-yewu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-yingyongjiankangshitu"></use>
                </svg>
                <div class="name">面性图标-应用健康视图</div>
                <div class="code-name">#icon-mianxingtubiao-yingyongjiankangshitu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-yingyongqiang"></use>
                </svg>
                <div class="name">面性图标-应用墙</div>
                <div class="code-name">#icon-mianxingtubiao-yingyongqiang</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-zuoyejiankongdaping"></use>
                </svg>
                <div class="name">面性图标-作业监控大屏</div>
                <div class="code-name">#icon-mianxingtubiao-zuoyejiankongdaping</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-yingyongjiankongguanli"></use>
                </svg>
                <div class="name">面性图标-应用监控管理</div>
                <div class="code-name">#icon-mianxingtubiao-yingyongjiankongguanli</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-zuoyeliuguanli"></use>
                </svg>
                <div class="name">面性图标-作业流管理</div>
                <div class="code-name">#icon-mianxingtubiao-zuoyeliuguanli</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-zuoyeguanli"></use>
                </svg>
                <div class="name">面性图标-作业管理</div>
                <div class="code-name">#icon-mianxingtubiao-zuoyeguanli</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-zuoyejiankong"></use>
                </svg>
                <div class="name">面性图标-作业监控</div>
                <div class="code-name">#icon-mianxingtubiao-zuoyejiankong</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-zixitong"></use>
                </svg>
                <div class="name">面性图标-子系统</div>
                <div class="code-name">#icon-mianxingtubiao-zixitong</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-Agentguanli"></use>
                </svg>
                <div class="name">面性图标-Agent 管理</div>
                <div class="code-name">#icon-mianxingtubiao-Agentguanli</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-shishijiankangpingfen"></use>
                </svg>
                <div class="name">面性图标-实时健康评分</div>
                <div class="code-name">#icon-mianxingtubiao-shishijiankangpingfen</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-mokuai"></use>
                </svg>
                <div class="name">面性图标-模块</div>
                <div class="code-name">#icon-mianxingtubiao-mokuai</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-biaogepaixu"></use>
                </svg>
                <div class="name">常用图标-表格排序</div>
                <div class="code-name">#icon-changyongtubiao-biaogepaixu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-jiahao"></use>
                </svg>
                <div class="name">常用图标-加号</div>
                <div class="code-name">#icon-changyongtubiao-jiahao</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-jiantou"></use>
                </svg>
                <div class="name">常用图标-箭头</div>
                <div class="code-name">#icon-changyongtubiao-jiantou</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-fanhui"></use>
                </svg>
                <div class="name">常用图标-返回</div>
                <div class="code-name">#icon-changyongtubiao-fanhui</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-shuangjiantou"></use>
                </svg>
                <div class="name">常用图标-双箭头</div>
                <div class="code-name">#icon-changyongtubiao-shuangjiantou</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-bitianxinghao"></use>
                </svg>
                <div class="name">常用图标-必填星号</div>
                <div class="code-name">#icon-changyongtubiao-bitianxinghao</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-duihao"></use>
                </svg>
                <div class="name">常用图标-对号</div>
                <div class="code-name">#icon-changyongtubiao-duihao</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-chahao"></use>
                </svg>
                <div class="name">常用图标-叉号</div>
                <div class="code-name">#icon-changyongtubiao-chahao</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-jianhao"></use>
                </svg>
                <div class="name">常用图标-减号</div>
                <div class="code-name">#icon-changyongtubiao-jianhao</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-changyongtubiao-bianji"></use>
                </svg>
                <div class="name">常用图标-编辑</div>
                <div class="code-name">#icon-changyongtubiao-bianji</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-shijian"></use>
                </svg>
                <div class="name">面性图标-时间</div>
                <div class="code-name">#icon-mianxingtubiao-shijian</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-shezhi"></use>
                </svg>
                <div class="name">面性图标-设置</div>
                <div class="code-name">#icon-mianxingtubiao-shezhi</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-sousuo"></use>
                </svg>
                <div class="name">面性图标-搜索</div>
                <div class="code-name">#icon-mianxingtubiao-sousuo</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-yonghu"></use>
                </svg>
                <div class="name">面性图标-用户</div>
                <div class="code-name">#icon-mianxingtubiao-yonghu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-zhongzhi"></use>
                </svg>
                <div class="name">面性图标-终止</div>
                <div class="code-name">#icon-mianxingtubiao-zhongzhi</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-tongzhi"></use>
                </svg>
                <div class="name">面性图标-通知</div>
                <div class="code-name">#icon-mianxingtubiao-tongzhi</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-tishi"></use>
                </svg>
                <div class="name">面性图标-提示</div>
                <div class="code-name">#icon-mianxingtubiao-tishi</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-dui"></use>
                </svg>
                <div class="name">面性图标-对</div>
                <div class="code-name">#icon-mianxingtubiao-dui</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-jiahaoyuan"></use>
                </svg>
                <div class="name">面性图标-加号（圆）</div>
                <div class="code-name">#icon-mianxingtubiao-jiahaoyuan</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-cuo"></use>
                </svg>
                <div class="name">面性图标-错</div>
                <div class="code-name">#icon-mianxingtubiao-cuo</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-bohui"></use>
                </svg>
                <div class="name">面性图标-驳回</div>
                <div class="code-name">#icon-mianxingtubiao-bohui</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-bangzhu"></use>
                </svg>
                <div class="name">面性图标-帮助</div>
                <div class="code-name">#icon-mianxingtubiao-bangzhu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-jia"></use>
                </svg>
                <div class="name">面性图标-加</div>
                <div class="code-name">#icon-mianxingtubiao-jia</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-riqi"></use>
                </svg>
                <div class="name">面性图标-日期</div>
                <div class="code-name">#icon-mianxingtubiao-riqi</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-jian"></use>
                </svg>
                <div class="name">面性图标-减</div>
                <div class="code-name">#icon-mianxingtubiao-jian</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-shaixuan"></use>
                </svg>
                <div class="name">面性图标-筛选</div>
                <div class="code-name">#icon-mianxingtubiao-shaixuan</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-jianhaoyuan"></use>
                </svg>
                <div class="name">面性图标-减号（圆）</div>
                <div class="code-name">#icon-mianxingtubiao-jianhaoyuan</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-jiazai"></use>
                </svg>
                <div class="name">面性图标-加载</div>
                <div class="code-name">#icon-mianxingtubiao-jiazai</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianxingtubiao-quanping"></use>
                </svg>
                <div class="name">面性图标-全屏</div>
                <div class="code-name">#icon-mianxingtubiao-quanping</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-xianxingtubiao-chedan"></use>
                </svg>
                <div class="name">线性图标-撤单</div>
                <div class="code-name">#icon-xianxingtubiao-chedan</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-xianxingtubiao-dayin"></use>
                </svg>
                <div class="name">线性图标-打印</div>
                <div class="code-name">#icon-xianxingtubiao-dayin</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-xianxingtubiao-jiahaoyuan"></use>
                </svg>
                <div class="name">线性图标-加号（圆）</div>
                <div class="code-name">#icon-xianxingtubiao-jiahaoyuan</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-xianxingtubiao-fujian"></use>
                </svg>
                <div class="name">线性图标-附件</div>
                <div class="code-name">#icon-xianxingtubiao-fujian</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-xianxingtubiao-guaqi"></use>
                </svg>
                <div class="name">线性图标-挂起</div>
                <div class="code-name">#icon-xianxingtubiao-guaqi</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-xianxingtubiao-xiazai"></use>
                </svg>
                <div class="name">线性图标-下载</div>
                <div class="code-name">#icon-xianxingtubiao-xiazai</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-xianxingtubiao-jianhaoyuan"></use>
                </svg>
                <div class="name">线性图标-减号（圆）</div>
                <div class="code-name">#icon-xianxingtubiao-jianhaoyuan</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-xianxingtubiao-baocun"></use>
                </svg>
                <div class="name">线性图标-保存</div>
                <div class="code-name">#icon-xianxingtubiao-baocun</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-xianxingtubiao-bukejian"></use>
                </svg>
                <div class="name">线性图标-不可见</div>
                <div class="code-name">#icon-xianxingtubiao-bukejian</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-xianxingtubiao-quanping1"></use>
                </svg>
                <div class="name">线性图标-全屏</div>
                <div class="code-name">#icon-xianxingtubiao-quanping1</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-xianxingtubiao-huifu"></use>
                </svg>
                <div class="name">线性图标-回复</div>
                <div class="code-name">#icon-xianxingtubiao-huifu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-xianxingtubiao-huanyuan"></use>
                </svg>
                <div class="name">线性图标-还原</div>
                <div class="code-name">#icon-xianxingtubiao-huanyuan</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-xianxingtubiao-kejian"></use>
                </svg>
                <div class="name">线性图标-可见</div>
                <div class="code-name">#icon-xianxingtubiao-kejian</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-xianxingtubiao-yijianbianpai"></use>
                </svg>
                <div class="name">线性图标-一键编排</div>
                <div class="code-name">#icon-xianxingtubiao-yijianbianpai</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-xianxingtubiao-fuwei"></use>
                </svg>
                <div class="name">线性图标-复位</div>
                <div class="code-name">#icon-xianxingtubiao-fuwei</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-xianxingtubiao-jian"></use>
                </svg>
                <div class="name">线性图标-减</div>
                <div class="code-name">#icon-xianxingtubiao-jian</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-xianxingtubiao-jia"></use>
                </svg>
                <div class="name">线性图标-加</div>
                <div class="code-name">#icon-xianxingtubiao-jia</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-xianxingtubiao-bohui"></use>
                </svg>
                <div class="name">线性图标-驳回</div>
                <div class="code-name">#icon-xianxingtubiao-bohui</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-xianxingtubiao-tishi1"></use>
                </svg>
                <div class="name">线性图标-提示</div>
                <div class="code-name">#icon-xianxingtubiao-tishi1</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-xianxingtubiao-zhongzhi"></use>
                </svg>
                <div class="name">线性图标-终止</div>
                <div class="code-name">#icon-xianxingtubiao-zhongzhi</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-xianxingtubiao-dianzan"></use>
                </svg>
                <div class="name">线性图标-点赞</div>
                <div class="code-name">#icon-xianxingtubiao-dianzan</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-xianxingtubiao-zujianjiagou"></use>
                </svg>
                <div class="name">线性图标-组件架构</div>
                <div class="code-name">#icon-xianxingtubiao-zujianjiagou</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-xianxingtubiao-riqi"></use>
                </svg>
                <div class="name">线性图标-日期</div>
                <div class="code-name">#icon-xianxingtubiao-riqi</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-xianxingtubiao-shijian1"></use>
                </svg>
                <div class="name">线性图标-时间</div>
                <div class="code-name">#icon-xianxingtubiao-shijian1</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-xianxingtubiao-dui"></use>
                </svg>
                <div class="name">线性图标-对</div>
                <div class="code-name">#icon-xianxingtubiao-dui</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-xianxingtubiao-cuo"></use>
                </svg>
                <div class="name">线性图标-错</div>
                <div class="code-name">#icon-xianxingtubiao-cuo</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-xianxingtubiao-wenjian"></use>
                </svg>
                <div class="name">线性图标-文件</div>
                <div class="code-name">#icon-xianxingtubiao-wenjian</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-xianxingtubiao-sousuo"></use>
                </svg>
                <div class="name">线性图标-搜索</div>
                <div class="code-name">#icon-xianxingtubiao-sousuo</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-xianxingtubiao-lishijilu"></use>
                </svg>
                <div class="name">线性图标-历史记录</div>
                <div class="code-name">#icon-xianxingtubiao-lishijilu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-xianxingtubiao-bangzhu"></use>
                </svg>
                <div class="name">线性图标-帮助</div>
                <div class="code-name">#icon-xianxingtubiao-bangzhu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-xianxingtubiao-fuzhi"></use>
                </svg>
                <div class="name">线性图标-复制</div>
                <div class="code-name">#icon-xianxingtubiao-fuzhi</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-xianxingtubiao-guanbigongdan"></use>
                </svg>
                <div class="name">线性图标-关闭工单</div>
                <div class="code-name">#icon-xianxingtubiao-guanbigongdan</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-xianxingtubiao-tishi"></use>
                </svg>
                <div class="name">线性图标-提示</div>
                <div class="code-name">#icon-xianxingtubiao-tishi</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-xianxingtubiao-tongzhi"></use>
                </svg>
                <div class="name">线性图标-通知</div>
                <div class="code-name">#icon-xianxingtubiao-tongzhi</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-xianxingtubiao-shezhi"></use>
                </svg>
                <div class="name">线性图标-设置</div>
                <div class="code-name">#icon-xianxingtubiao-shezhi</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-xianxingtubiao-yonghu"></use>
                </svg>
                <div class="name">线性图标-用户</div>
                <div class="code-name">#icon-xianxingtubiao-yonghu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-xianxingtubiao-lashen"></use>
                </svg>
                <div class="name">线性图标-拉伸</div>
                <div class="code-name">#icon-xianxingtubiao-lashen</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-xianxingtubiao-shanchu"></use>
                </svg>
                <div class="name">线性图标-删除</div>
                <div class="code-name">#icon-xianxingtubiao-shanchu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-xianxingtubiao-zhankai"></use>
                </svg>
                <div class="name">线性图标-展开</div>
                <div class="code-name">#icon-xianxingtubiao-zhankai</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-xianxingtubiao-shouqi"></use>
                </svg>
                <div class="name">线性图标-收起</div>
                <div class="code-name">#icon-xianxingtubiao-shouqi</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-xianxingtubiao-tiaozhuan1"></use>
                </svg>
                <div class="name">线性图标-跳转</div>
                <div class="code-name">#icon-xianxingtubiao-tiaozhuan1</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-xianxingtubiao-tuodong"></use>
                </svg>
                <div class="name">线性图标-拖动</div>
                <div class="code-name">#icon-xianxingtubiao-tuodong</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-xianxingtubiao-shijian"></use>
                </svg>
                <div class="name">线性图标-时间</div>
                <div class="code-name">#icon-xianxingtubiao-shijian</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-xianxingtubiao-quanping"></use>
                </svg>
                <div class="name">线性图标-全屏</div>
                <div class="code-name">#icon-xianxingtubiao-quanping</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-xianxingtubiao-gengduo1"></use>
                </svg>
                <div class="name">线性图标-更多</div>
                <div class="code-name">#icon-xianxingtubiao-gengduo1</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-xianxingtubiao-ketuodong1"></use>
                </svg>
                <div class="name">线性图标-可拖动</div>
                <div class="code-name">#icon-xianxingtubiao-ketuodong1</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-xianxingtubiao-miaozhun"></use>
                </svg>
                <div class="name">线性图标-瞄准</div>
                <div class="code-name">#icon-xianxingtubiao-miaozhun</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-xianxingtubiao-paixu"></use>
                </svg>
                <div class="name">线性图标-排序</div>
                <div class="code-name">#icon-xianxingtubiao-paixu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-xianxingtubiao-piliangbianji"></use>
                </svg>
                <div class="name">线性图标-批量编辑</div>
                <div class="code-name">#icon-xianxingtubiao-piliangbianji</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-xianxingtubiao-shezhi2"></use>
                </svg>
                <div class="name">线性图标-设置2</div>
                <div class="code-name">#icon-xianxingtubiao-shezhi2</div>
            </li>
          
          </ul>
          <div class="article markdown">
          <h2 id="symbol-">Symbol 引用</h2>
          <hr>

          <p>这是一种全新的使用方式，应该说这才是未来的主流，也是平台目前推荐的用法。相关介绍可以参考这篇<a href="">文章</a>
            这种用法其实是做了一个 SVG 的集合，与另外两种相比具有如下特点：</p>
          <ul>
            <li>支持多色图标了，不再受单色限制。</li>
            <li>通过一些技巧，支持像字体那样，通过 <code>font-size</code>, <code>color</code> 来调整样式。</li>
            <li>兼容性较差，支持 IE9+，及现代浏览器。</li>
            <li>浏览器渲染 SVG 的性能一般，还不如 png。</li>
          </ul>
          <p>使用步骤如下：</p>
          <h3 id="-symbol-">第一步：引入项目下面生成的 symbol 代码：</h3>
<pre><code class="language-html">&lt;script src="./iconfont.js"&gt;&lt;/script&gt;
</code></pre>
          <h3 id="-css-">第二步：加入通用 CSS 代码（引入一次就行）：</h3>
<pre><code class="language-html">&lt;style&gt;
.icon {
  width: 1em;
  height: 1em;
  vertical-align: -0.15em;
  fill: currentColor;
  overflow: hidden;
}
&lt;/style&gt;
</code></pre>
          <h3 id="-">第三步：挑选相应图标并获取类名，应用于页面：</h3>
<pre><code class="language-html">&lt;svg class="icon" aria-hidden="true"&gt;
  &lt;use xlink:href="#icon-xxx"&gt;&lt;/use&gt;
&lt;/svg&gt;
</code></pre>
          </div>
      </div>

    </div>
  </div>
  <script>
  $(document).ready(function () {
      $('.tab-container .content:first').show()

      $('#tabs li').click(function (e) {
        var tabContent = $('.tab-container .content')
        var index = $(this).index()

        if ($(this).hasClass('active')) {
          return
        } else {
          $('#tabs li').removeClass('active')
          $(this).addClass('active')

          tabContent.hide().eq(index).fadeIn()
        }
      })
    })
  </script>
</body>
</html>
